母版页和母版页子页面中的jquery对服务器控件元素的操作

最新推荐文章于 2023-12-19 09:09:22 发布

原创最新推荐文章于 2023-12-19 09:09:22 发布 · 2.8k 阅读

CC 4.0 BY-SA版权

文章标签：

326 篇文章

订阅专栏

93 篇文章

订阅专栏

64 篇文章

订阅专栏

本文详细解释了在使用ASP.NET的母版页时，如何处理母版页与子页面中服务器端控件的命名冲突，以及如何在jQuery中正确引用这些控件以实现预期的功能。

使用asp.net的母版页套用出来的页面中母版页和套用母版页的子页面中的服务器端控件的名称会与服务器控件中的定义不一致，

例如：

母版页的控件

<span style="font-size:18px;"><asp:TextBox ID="txtAccount" runat="server"  placeholder="用户名" Width="110px"></asp:TextBox></span>

在浏览器端显示的源代码

<span style="font-size:18px;"> <input name="ctl00$txtAccount" type="text" id="ctl00_txtAccount" placeholder="用户名" style="width:110px;" /></span>

套用母版页的子页面中的控件

<span style="font-size:18px;"><asp:HyperLink ID="HyperLink1" runat="server" ForeColor="#666666" ></asp:HyperLink></span>

在浏览器端显示的源代码

<a id="ctl00_ContentPlaceHolder3_dlCommodity_ctl00_HyperLink1" style="color:#666666;"></a>

包含了HyperLink1所在的各级容器dlCommodity（datalist）和ContentPlaceHolder3

因此，如果要在母版页面中写jquery(js),对该控件的引用$("#原来服务器端的命名id")（例如，$("#txtAccount")）则在生成的页面不能定位，使用类似

$(input[id*='txtAccount'])可实现在生成页面正常定位并实现jquery效果