如何引用visualforce中指定的html元素id并传递给javascript函数？

我有一个生成输入文本字段的apex标记

<apex:page id="my_page">
    <apex:inputText id="foo" id="c_txt"></apex:inputText>
</apex:page>

在我的Javascript中，我试图

getElementById（'c_txt'）

，但这当然不起作用。怎么处理这个

更新

看来我能做到，但不工作

<apex:includeScript value="{!URLFOR($Resource.datepickerjs)}"></apex:includeScript>

<apex:inputText id="foo" id="c_txt" onclick="javascript:displayDatePicker()" />

警报显示为“null”，因此一定是出了问题

即使此警报也返回null

var targetDateField = document.getElementById('{!$Component.my_page:c_txt}');
alert(targetDateField);

---

我找到了解决问题的办法

$Component全局visualforce表达式只能在visualforce代码中使用，而不能在 Javascript作为我的搜索

下面的代码工作正常。它将inputText字段中的值输出到js alert message，现在您可以将id属性传递给Javascript并处理任务所需的任何内容

Created Date: <apex:inputText id="dah" value="{!created}" size="50" 
onclick="javascript:go('{!$Component.dah}')"></apex:inputText>

<script>
  function go(field) {
    var huh = document.getElementById(field).value;
    alert(huh); //returns the string u put inside of input text field
  }
</script>

创建日期：
功能go（字段）{
var huh=document.getElementById（field）.value；
alert（huh）；//返回输入文本字段中的字符串u
}

您可以在javascript中使用

$Component

符号，如下所示：

var e = document.getElementById("{!$Component.ComponentId}");

但需要注意的一点是，如果您的元素包含在具有ID的Visualforce标记的多个级别中：

<apex:pageBlock id="theBlock">
    <apex:pageBlockSection id="theBlockSection">
        <apex:commandLink action="{!someAction}" value="LINK!" id="theLink"/>

// snip

// in javascript you would reference this component using:
document.getElementById("{!$Component.theBlock.theSection.theLink}");

//剪断
//在javascript中，您可以使用以下方法引用此组件：
document.getElementById（“{！$Component.theBlock.theSection.theLink}”）；

奇怪的是，如果您使用的$Component.block.section位于块之外的任何位置，则它将不工作并返回空。

Created Date: <apex:inputText id="dah" value="{!created}" size="50" 
onclick="javascript:go('{!$Component.dah}')"></apex:inputText>

<script>
  function go(field) {
    var huh = document.getElementById(field).value;
    alert(huh); //returns the string u put inside of input text field
  }
</script>

var e = document.getElementById("{!$Component.ComponentId}");

<apex:pageBlock id="theBlock">
    <apex:pageBlockSection id="theBlockSection">
        <apex:commandLink action="{!someAction}" value="LINK!" id="theLink"/>

// snip

// in javascript you would reference this component using:
document.getElementById("{!$Component.theBlock.theSection.theLink}");