javascript 将 body_0$ 添加到 ID 选择器答案

【问题标题】：javascript adds body_0$ to ID selectorjavascript 将 body_0$ 添加到 ID 选择器
【发布时间】：2016-03-07 14:17:47
【问题描述】：

我正在使用 javascript 进行表单验证，仅适用于输入字段，但不适用于文本框。我用：

 var _firstname;
 var box;

 try {
 box = $("#firstname");
 alert("You must enter a first name");
 box.focus();
 return false;
 }catch{
 }

前端是：

  <div>First Name <span class="required">*</span></div>
  <asp:TextBox ID="firstname" name="firstname" runat="server" />

当我调试代码时，它会在 ID 的前面添加一个 body_0$（即：body_0$firstname），所以我猜这就是为什么它总是弹出“您必须输入名字”警报的原因.有解决办法吗？

【问题讨论】：

标签： javascript c# asp.net webforms

【解决方案1】：

不，JavaScript 不这样做。 ASP.NET WebForms 运行时 可以做到这一点。您提供的 ID 属性由服务器端使用，不会“按原样”输出到客户端。

在其默认模式下，WebForms ~~mangles~~ 装饰 id 属性具有runat="server" 元素ID 的层次结构。这对 WebForms 非常有用，因为您可以在转发器、面板等中重复使用 ID，而无需在客户端上创建重复的 ID。但是，它对其他任何东西都不是很好，比如浏览器或苦苦挣扎的前端开发人员。

这个 2009 年的老问题可能会有所帮助：

How to stop ASP.NET from changing IDs in order to use jQuery

解决方案

从 ASP.NET 4.0 开始，可以选择ClientIDMode。将其设置为Predictable 或Static，如下所示：

<%@Page Language="C#"
    CodeBehind="MyFormName.aspx.cs"
    Inherits="MyWebApplication.MyFormName"
    ClientIDMode="Static" 
%>

当您重用或重复服务器端控件时，请注意不要这样做，因为这会创建具有相同客户端 ID 的多个元素！ （在dman2306的评论后更新）

Read more about ClientIDMode on MSDN

【讨论】：

那么没有ASP改变ID就没有办法将前端的ID翻译成Javascript？
ClientIDMode 对象上有一个 ClientIDMode 设置。我已经更新了我的答案。
请注意，当您将其设置为静态时，您需要确保没有重复项。如果您在 INamingContainer （例如中继器或网格）中拥有此控件，您最终会得到重复的 ID，并且事情将无法按预期工作。这就是 ASP.NET 对您的 ID 所做的事情以确保唯一性的原因。

【解决方案2】：

如果您的实际问题不是获取 ID 的值，那么使用它呢？

box = $("[id*=" + 'firstname' + "]").val();

它将查找包含字符串'firstname'的所有ID

尽管在您的代码中它只是运行并显示警报。而且您对 box 的分配是控件本身，而不是值。

【讨论】：

alert() 周围没有条件包装器。您分配给 box，然后调用 alert()。你需要类似 if (box === 'undefined') { alert(); }