在呈现一个ASP.NET服务器控件时,控件的ClientID属性呈现为元素的id和name属性。(ClientID根据你为控件设置的ID属性自动生成。)例如,你可能创建如下的ASP.NET服务器控件:
<asp:textbox id="TextBox1" runat="server" text="Sample Text" />
ClientID被设置为TextBox1,在基于HTML的浏览器中,它最终看起来可能就像这样:
<input name="TextBox1" type="text" value="Sample Text" id="TextBox1" />
注意form元素仅仅呈现一个ID属性,没有name属性。
于是,你可以在客户端脚本使用这些属性来引用服务器控件。一般,你必须在客户端脚本中使用一个全限定的引用来寻址控件;如果此控件是form元素的一个孩子,你一般可以这样引用它:
document.forms[0].TextBox1.value = "New value";
引用一个服务器控件的确切语法依赖于你正在使用什么控件和它是否是另一个控件的孩子。如果你不确定如何引用它,那么运行web页面,查看它的源代码,以决定控件是如何被呈现的。
Demo:
下面的示例展示了如何利用JavaScript脚本确定子控件的ClientID:
//MasterPage.master
<%...@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>MasterPage</title>
<script type="text/javascript" src="JScript.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
母版页:
下面是一个位于MasterPage中的一个ASP.NET按钮控件,其ID是btnInMasterPage。单击它可以获取它的ClientID。<br />
<asp:Button ID="btnInMasterPage" runat="server" Text="Click me" OnClientClick="return getMasterClientID();" />
<asp:Label ID="lblInMasterPage" runat="server" Text=""></asp:Label>
<hr />
<script type="text/javascript">...
var btnInMasterPageID = '<%= btnInMasterPage.ClientID %>';
</script>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
//Content.aspx
<%...@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
CodeFile="Content.aspx.cs" Inherits="Content" Title="如何获取控件的ClientID" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
内容页:下面是一个位于ContentPage中的一个ASP.NET按钮控件,其ID是btnInContentPage。单击它可以获取它的ClientID。<br />
<asp:Button ID="btnInContentPage" runat="server" Text="Click me" OnClientClick="return getContentClientID();" />
<asp:Label ID="lblInContentPage" runat="server" Text=""></asp:Label>
<script type="text/javascript">...
var btnInContentPageID = '<%= btnInContentPage.ClientID %>';
</script>
</asp:Content>
//jscript.js
// JScript File
/**//*
这里也展示了如何阻止一个ASP.NET Button控件的回传。
1: 设置Button按钮的客户端单击事件的处理器
OnClientClick="return getMasterClientID();"
注意,这里的return必不可少。
2: 当条件不满足时,在事件处理器中返回false即可。
*/
function getMasterClientID()
...{
alert(btnInMasterPageID);
return false;
}
function getContentClientID()
...{
alert(btnInContentPageID);
return false;
}
标签:
本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@evget.com
文章转载自:博客