ASP.NET4 ClientID 处理

传统ASP.NET开发中，javascript处理服务器端控件的ID方式是：

<mce:script type="text/javascript"><!-- function DoSomething(){ alert('<%= Control.ClientID %>'); } // --></mce:script>

 

在ASP.NET4中提供了ClientIDMode属性：

<asp:Label ID="Label1" runat="server" ClientIDMode="[Mode Type]" />

 

如果ClientIDMode设置为Legacy，那么结果如下：

<asp :TextBox ID ="txtEcho" runat ="server" Width ="65%" ClientIDMode ="Legacy" /> <input id="ctl00_MasterPageBody_ctl00_txtEcho" style="width: 65%" name="ctl00$MasterPageBody$ctl00$txtEcho" />

 

如果ClientIDMode设置为Static，那么结果如下：

<asp:TextBox ID="txtEcho2" runat="server" Width="65%" ClientIDMode="Static" /> <input id="txtEcho2" style="width: 65%" name="ctl00$MasterPageBody$ctl00$txtEcho2" />

 

ASP.NET4中Static被经常使用，另外还有Predictable也被经常使用，结果如下：

<asp:GridView ID="EmployeesNoSuffix" runat="server" AutoGenerateColumns="false" ClientIDMode="Predictable" > <Columns> <asp:TemplateField HeaderText="ID"> <ItemTemplate> <asp:Label ID="EmployeeID" runat="server" Text='<%# Eval("ID") %>' /> </ItemTemplate> </asp:TemplateField> <asp:TemplateField HeaderText="Name"> <ItemTemplate> <asp:Label ID="EmployeeName" runat="server" Text='<%# Eval("Name") %>' /> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> <table id="EmployeesNoSuffix" style="border-collapse: collapse" mce_style="border-collapse: collapse" cellspacing="0" rules="all" border="1"> <tbody> <tr> <th scope="col">ID</th> <th scope="col">Name</th> </tr> <tr> <td><span id="EmployeesNoSuffix_EmployeeID_0">1</span></td> <td><span id="EmployeesNoSuffix_EmployeeName_0">EmployeeName1</span></td> </tr> ... <tr> <td><span id="EmployeesNoSuffix_EmployeeID_8">9</span></td> <td><span id="EmployeesNoSuffix_EmployeeName_8">EmployeeName9</span></td> </tr> </tbody> </table>

 

 

小结完毕，详细介绍请看MSDN：http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientidmode.aspx