控件id正确呈现，但仍然得到javascript错误

control id rendered correctly but still getting javascript error

本文关键字：错误 javascript id 控件      更新时间：2023-09-26

错误:

Microsoft JScript runtime error: 'ctl00_ContentPlaceHolder1_txtAdmDate' is undefined

代码:

<input ID="txtAdmDate" runat="server" readonly="readonly" type="text" 
                                        tabindex="23" clientidmode="AutoID" />
    <a href="#" onclick="showCalendarControl(ctl00_ContentPlaceHolder1_txtAdmDate)">
                                    <img border="0" src="images/SmallCalendar.jpg" 
                                        style="width: 20px; height: 20px" /></a>
Javascript: 

function showCalendarControl(textField) {
      calendarControl.show(textField);
    }
来源: 
<input name="ctl00$ContentPlaceHolder1$txtAdmDate" type="text" id="ctl00_ContentPlaceHolder1_txtAdmDate" readonly="readonly" tabindex="23" />
       <a href="#" onclick="showCalendarControl(ctl00_ContentPlaceHolder1_txtAdmDate)">
        <img border="0" src="images/SmallCalendar.jpg" 
                                        style="width: 20px; height: 20px" /></a>
<标题>问题:

虽然呈现的html源代码显示控件的id为ctl00_ContentPlaceHolder1_txtAdmDate，并且将相同的id传递给javascript函数，但会产生错误。我试过将clientidmode设置为Autoid和静态，但没有任何效果。需要你们的帮助来解决这个问题

首先，它看起来像您在一个母版页或用户控制(因此名称混淆)，在这种情况下，您不应该假设如何通过硬编码来混淆名称。如果您使用不同的母版页或将用户控件移动到另一个页面，那么这个混乱的名称可能会有所不同。要解决这个问题，请使用ClientID属性。

此外，您不能直接通过名称引用控件来让Javascript找到它，因为控件不是全局变量。相反，您可以使用document。getElementById查找控件的句柄。

<a href="#" onclick="showCalendarControl(document.getElementById('<%=txtAdmDate.ClientID%>')">

当你说:

showCalendarControl(ctl00_ContentPlaceHolder1_txtAdmDate)

你假设ctl00_ContentPlaceHolder1_txtAdmDate是一个变量，但它不是一个变量，它只是一个DOM id属性。你可以这样写:

showCalendarControl(document.getElementById('ctl00_ContentPlaceHolder1_txtAdmDate'))

将其转换为函数调用中的对象，或者您可以将ID发送给showCalendarControl并让它将ID转换为对象:

onclick="showCalendarControl('ctl00_ContentPlaceHolder1_txtAdmDate')"

然后调整showCalendarControl:

function showCalendarControl(textFieldId) {
    var textField = document.getElementById(textFieldId);
    calendarControl.show(textField);
}
相关文章：