如何阻止ASP.NET更改ID以使用jQuery

我在我的网页上有这个标签控件

<asp:Label ID="Label1" runat="server" Text="test"></asp:Label> 

而当页面呈现控件的id改变为这样的东西

  <span id="ctl00_ContentPlaceHolder1_Label3">test</span> 

我怎样才能停止改变ID为了执行这样的jQuery操作的asp.net

 $('#label1').html(xml); 

Answer 1

而不是使用这个select器

 $('#Label1') 

使用这一个，基本上你使用的是经典的ASP内联服务器端代码。

 $('#<%= Label1.ClientID %>') 

这将插入任何生成的ID作为文字放置。

如果你想使用外部文件，那么我会build议你在页面上创build一个全局的obj来保存所有的客户id，然后在你的外部文件中引用这个obj（不理想，但它是一个解决scheme）

 var MyClientIDs = { Label1 = '<%= Label1.ClientID %>', Label2 = '<%= Label2.ClientID %>', Textbox1 = '<%= Textbox1.ClientID %>', Textbox2 = '<%= Textbox2.ClientID %>' }; 

然后在外部文件中可以访问Label1，例如： $('#' + MyClientIDs.Label1)

Answer 2

.NET 4现在可以让你select你的ClientIDMode ：

types： System.Web.UI.ClientIDMode

指示如何生成ClientID属性的值。 默认是inheritance。

AutoID ClientID值是通过将每个父命名容器的ID值与控件的ID值连接而生成的。 在呈现多个控件实例的数据绑定scheme中，将在控件的ID值前插入递增值。 每个段由下划线字符（_）分隔。 此algorithm用于早于ASP.NET 4的ASP.NET版本。

静态 ClientID值设置为ID属性的值。 如果控件是命名容器，则该控件将用作其包含的任何控件的命名容器层次结构的顶层。

可预测此algorithm用于数据绑定控件中的控件。 ClientID值是通过连接父命名容器的ClientID值与控件的ID值生成的。 如果控件是生成多行的数据绑定控件，则在ClientIDRowSuffix属性中指定的数据字段的值将在最后添加。 对于GridView控件，可以指定多个数据字段。 如果ClientIDRowSuffix属性为空，则会在结尾处添加序列号，而不是数据字段值。 这个数字从零开始，每行增加1。 每个段由下划线字符（_）分隔。

inheritance控件inheritance其NamingContainer控件的ClientIDMode设置。

Answer 3

你不能停止生成这些ID的asp.net。 这就是它如何做的事情。

你仍然可以像这样使用jquery：

 $('#<%=label1.ClientID %>').html(xml) 

要么

 $('[id$=_label1]').html(xml) 

Answer 4

当且仅当你的容器布局永远不会改变，你需要把你的JavaSctipt / jQuery放到一个外部文件中，你可以在你的jQueryselect器中使用生成的id

 $('#ctl00_ContentPlaceHolder1_Label3').html(xml); 

显然，这种方法要求你找出生成的id是什么，如果你开始改变站点/应用程序的构造，需要小心。

否则，你最好的select是

1.使用内联服务器端代码标记。 这种方法的缺点是，你不能把你的js代码放在外部文件中 –

 $('#<%= Label3.ClientID %>').html(xml); 

2.定义你需要在你的jQuery中使用的每个控件的独特的CSS类，这仍然允许你把你的js代码放在一个外部文件中 –

 <asp:Label ID="Label3" runat="server" Text="test" CssClass="label3"> </asp:Label> $('.label3').html(xml); 

3.使用jQueryselect器模式匹配原始的id，这将允许你把你的js代码放在一个外部文件中 –

 $('[id$=Label3]').html(xml); 

这个jQueryselect器将select所有具有以Label3结尾的属性id的元素。 这种方法唯一可能的缺点就是理论上可能会有一个标签控件，其中包含一个名为Label3的标签，也就是一个母版页，也可以在两个内容页中。 在这个例子中，使用上面的jQueryselect器将匹配所有三个标签，这可能会有不必要的后果。

编辑：

我认为把注意力集中到IDOverride控件上可能会有用。 示例页面可以在这里find

它使您可以指定哪些控件在输出的HTML标记中应该有自己的损坏的id，如在.aspx文件中给出的id所覆盖的那样。 我只用一个主页和面板简单地玩了一下，但它似乎运作良好。 使用这个，你可以在你的jQueryselect器中使用原始的id。 但是，请注意，如果您的母版页和内容页中的控件具有相同的ID，并且这些控件的内容页被合并为一页的HTML，则结果是不可预知的。

Answer 5

设置ClientIDMode="Static" 。 这将解决您的问题。

例：

 <asp:Label ID="Label1" ClientIDMode="Static" runat="server" Text="test"></asp:Label> 

Answer 6

简短的回答，不要担心使用asp.net的ID。 在asp.net中，你可以添加自己的属性到一个标签：

 <asp:TexBox ID="myTBox" runat="server" MyCustomAttr="foo" /> 

然后在jQuery中，您可以通过以下方式引用此元素：

 $("input[MyCustomAttr='foo']") 

我一直用jQuery来做这件事。 希望能帮助到你。

Answer 7

内联代码是正确的方法。 但是，这将在ASP.NET 4.0中改变。 我们花了一些时间添加一个function，允许完全控制客户端生成的ID。 以下是networking上关于此function的一些资源。

• http://blog.osbornm.com/archive/2009/01/06/asp.net-4.0-clientid-overview-again.aspx
• http://channel9.msdn.com/shows/10-4/10-4-Episode-3-ASPNET-WebForms-40/

Answer 8

如果你在母版的第一行中input这个，你的控件ID不会改变：

ClientIDMode="Static"

喜欢;

 <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="Main_MasterPage" ClientIDMode="Static" %> 

Answer 9

这里的大部分build议都可以工作，但是jQuery代码的testing结果显示，纯IDselect器是最快的。 我最经常使用的一个：

 $("[id$=origControlId]") 

是相当缓慢的，但问题不是太明显，除非页面有很多控件和很多的jQuery。

既然将多个类分配给一个控件是相当痛苦的，你可以给每一个CSSClass匹配这个ID。 由于他们将是唯一的（你将不得不观看生成多个控件的中继器types控件），你可以按类select。

例如：

 <asp:Label ID="Label1" CssClass="Label1 SomeOtherClass" runat="server" Text="test"> </asp:Label> 

可以唯一地select：

 $(".Label1") 

这几乎和IDselect一样快。

我从来没有考虑过这个：

 $('#<%= Label1.ClientID %>') 

但我要去试试看！

Answer 10

您必须将控件的ClientID传递给javascript代码（我怀疑Label1是否被重命名为Label3）

 ClientScriptManager.RegisterClientScriptBlock(GetType(), "someKey", "$('#" + Label1.ClientID + "').html(xml);", true); 

Answer 11

您可以使用ClientID （就像其他人所说的一样），但问题是它不能在外部JavaScript文件中使用。

所以，理想情况下，不要使用ID从jQuery中引用它，而是使用CSS类 ：

 <asp:Label ID="Label1" runat="server" Text="test" CssClass="myclass"></asp:Label> 

那么你可以像这样引用它：

 $(".myclass") 

Answer 12

你可以像这个家伙一样覆盖ClientID和UniqueID。

 /// <summary> /// Override to force simple IDs all around /// </summary> public override string UniqueID { get { return this.ID; } } /// <summary> /// Override to force simple IDs all around /// </summary> public override string ClientID { get { return this.ID; } } 

Answer 13

您也可以创build一个inheritance自Label的自定义控件，该控件将ID属性重写为您所希望的。

Answer 14

这可以通过在呈现控件时用原始idreplaceasp.net id来实现。 这很容易，可以通过创build一组自定义控件来避免。

http://www.bytechaser.com/en/articles/ts8t6k5psp/how-to-display-aspnet-controls-with-clean-id-value.aspx

Answer 15

面临明显变化的风险：

 <asp:Label ID="Label1" runat="server" Text="test"></asp:Label> 

至

 <Label ID="Label1" Text="test"></Label> 

Answer 16

你需要把属性ClientIDMode="Static"放到你的button中，这个授予的ID在运行时是一样的，这就是你需要在Javascript中获得对象的东西。

Answer 17

你不需要“防止”asp.net改变控制ID为了使用jquery或者javascript就可以了。

在页面上呈现的id是控件的ClientID属性，而您在控件上设置的是该ID。 您无法设置ClientID属性，它是为您生成的，可能与您的ID相同也可能不同。 但是，正如其他人所提到的，您可以在您的aspx中使用ClientID属性：

 $('<%= Label1.ClientID %>').html() 

或者使用其中一种ClientScriptManager方法在客户端脚本的代码后面注册客户端脚本。

Answer 18

只是摆脱占位符。 或者按类或DOM层次结构进行select。 甚至在ID上使用部分匹配作为最后的手段。 有许多简单，干净的方法来selectjQuery中的元素，我们需要摆脱旧的，丑陋的ASP.NET习惯。

Dreas Grech把最后的钉子放在棺材里。 您不能在$（'＃<％= label1.ClientID％>'）types的解决scheme中使用外部脚本文件。

麦克风

Answer 19

您仍然可以使用PlaceHolder并在PlaceHolder标签中设置ClientIDMode ：

 <asp:ContentPlaceHolder ID="BodyContent" runat="server" ClientIDMode="Static"> </asp:ContentPlaceHolder> 

所包含的控制ID都不会被改变。

Answer 20

简单，重写控件类。 这里是一个HtmlGenericControl的例子，但你可以用任何ASP.Net控件来做到这一点：

 public class NoNamingContainerControl : HtmlGenericControl { public NoNamingContainerControl(string tag) : base(tag) { } public override string ClientID { get { return this.ID; } } }