如何使用jQuery访问asp.net控件
<asp:TextBox runat="server" ID="myTextBox" />
$('#myTextBox') 不会工作。
$('#myTextBox')
上面的aspx代码在页面上呈现时变为
<input type="text" id="ctl00_Main_myTextBox" name="ctl00$Main$myTextBox" />
这是因为.net控件所在的主控信息和控制信息被预先放置,这使我们编写选择器变得有些棘手。
您有几种选择。这绝不是全面的,但我会尝试一下。
选项1:
$('#<%= myTextBox.ClientID %>')
使用ClientID-建议,但不是。ClientID如果可以的话,我会尽量避免写作。主要原因是,您只能在.aspx页面中使用它,而不能在外部.js文件中使用它。
ClientID
.aspx
.js
选项2:
$('[id$=myTextBox]') // id which ends with the text 'myTextBox' $('[id*=myTextBox]') // id which contains the text 'myTextBox'
使用属性选择器 -也建议使用,看起来有点难看,但有效。
我在这里看到了一些问题,担心这些选择器的性能。 这是最好的方法吗? 没有。
但是,大多数时候您甚至都不会注意到性能受到影响,除非您的DOM树很大。
选项3:
使用CssClass-强烈建议。因为使用类的选择器是干净且简单的。
CssClass
如果您想知道,CssClass.net控件与class传统html控件相同。
class
<asp:TextBox runat="server" ID="myTextBox" CssClass="myclass" /> //add CssClass $('.myclass') //selector
选项4:
ClientIDMode="Static"在控件上使用.NET Framework 4.0中引入的Use ,以便其ID保持不变。-也推荐。
ClientIDMode="Static"
<asp:TextBox runat="server" ID="myTextBox" ClientIDMode="Static" /> //add ClientIDMode $('#myTextBox') //use the normal ID selector
注意:根据我的经验,我看到过类似的丑陋选择器$('#ctl00_Main_myTextBox')。这是直接复制粘贴从页面呈现的ID并将其在脚本中使用的结果。看,这会起作用。但是请考虑一下,如果控件ID或主ID发生更改,将会发生什么情况。显然,您将不得不重新访问这些ID并再次进行更改。而是使用上面的选项之一进行覆盖。
$('#ctl00_Main_myTextBox')