代码之家 › 专栏 › 技术社区 › VoodooChild

自定义控件的HTMLDocument getElementById返回null,为什么?是否有其他访问方法?

asp.net javascript

VoodooChild · 技术社区 · 14 年前

我在aspx页面的body标签中有以下内容:

<form id="Form1" method="post" runat="server">
 <customControl:menu id="Menu1" runat="server">
 </customControl:menu>
</form>

从另一个aspx页面我有一个javascript函数:

<script type="text/javascript">
 function testFunction(args, name) {
  alert(top.frames[0].document);      //gives me [object HTMLDocument]
  alert(top.frames[0].document.getElementById("Form1"));  //gives me [object HTMLFormElement]
  alert(top.frames[0].document.getElementById("Menu1"));      //gives me [null]
 }
</script>

为什么第三个警报给我空值?(The) menu 是带有 ascx

谢谢,

4 回复 | 直到 14 年前

Scott Mitchell 14 年前

Take Control Of Web Control ClientID Values in ASP.NET 4

中的每个服务器端Web控件 ASP.NETWeb窗体应用程序具有标识Web的ID属性控件的名称代码隐藏类。当渲染为将服务器端ID值转换为客户端id属性。理想的, 会有一对一的服务器端ID属性和已生成客户端id,但在事实上事情并不是那么简单。由默认情况下,呈现的客户端id 其ID属性 命名容器 如果ID为txtName,则可以渲染包含一个 ctl00\u主内容\u txtName。

此默认翻译来自服务器端ID属性值通过JavaScript访问HTML元素, 这通常由id完成,如页面开发人员构建网页而编写JavaScript并不需要知道渲染的id值是多少 Web控件将在设计时启动。

Web控件的客户端id值可以在运行时通过Web控件的ClientID属性确定。这就是为什么其他人建议使用<%=Menu1.ClientID%>来代替硬编码的id名称。

如果您正在使用ASP.NET4.0您可以更好地控制Web控件如何通过客户端将其ID属性呈现为客户端ID。也就是说,可以将菜单的ClientIDMode属性设置为Static,以确保服务器端ID属性和客户端ID属性之间存在一对一的对应关系(但使用这种方法时必须小心)。

有关更多信息,请参阅:

ASP.NET 4.0 ClientID Overview

快乐编程!

Oded 14 年前

这个 id 正在由输出asp.net可能不是 Menu1 - asp.net通常将容器名称连接到控件 身份证件 ,以避免重复

使用 ClientId 属性以获取 身份证件 将输出到浏览器:

alert(top.frames[0].document.getElementById("<%:Menu1.ClientId%>")); // .NET 4 syntax
alert(top.frames[0].document.getElementById("<%=Menu1.ClientId%>")); // .NET 2/3/3.5 syntax

Jacob Mattison 14 年前

在aspx代码中,您可以通过使用ClientId属性来访问该运行时id。或者,可以使用jQuery和其他选择器(例如名称、类等)来标识元素。

user1921 user1921 14 年前

试试这个

 alert(top.frames[0].document.getElementById("<% = Menu1.ClientID %>"));

ClientIDMode="Static"

http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and-net-4-0-series.aspx