Javascript 数组 ID答案

【问题标题】：Javascript Array ID'sJavascript 数组 ID
【发布时间】：2012-02-22 20:32:16
【问题描述】：

我有一个 HTML 页面，其中包含我需要使用 JQuery 访问的元素。下面是如何识别表单元素的示例：

<div id="nItemID[766]Line" class="formLine ">
   <span id="nItemID[766]Label" class="formLabel alignTop">Téléphone:</span>
   <input id="nItemID[766]Field" class="formField" type="text" maxlength="11" value="" name="nItemID[766]" style="width: 300;">
</div>

当我尝试显示特定元素的 ID 时，它会告诉我：例如 nItemID[766]Label。但是当我输入那个代码时，它什么也找不到......

alert( $("#nItemID[766]Field").val() );

有人可以帮助我访问这些特定元素吗？

谢谢！

【问题讨论】：

它不是一个有效的ID来操作.. "ID和NAME令牌必须以字母（[A-Za-z]）开头，后面可以跟任意数量的字母、数字（[ 0-9])、连字符 ("-")、下划线 ("_")、冒号 (":") 和句点 (".")。"
[] 是 ID 的无效字符。见stackoverflow.com/questions/70579/…
从技术上讲，该 jquery 选择器正在寻找一个 id 为 nItemID 的元素，并具有一个名为 766 的属性。由于这个原因，[] 不允许在 ID 中使用。
@MarcB 这根本不是原因。 HTML 在设计时并未考虑到 jQuery。
对于那些说这里的 id 无效的人，如果 OP 使用的是 HTML5 doctype，那么包含这些字符的 id 是完全有效的。

标签： javascript jquery html forms

【解决方案1】：

您必须用反斜杠转义方括号：

alert($('#nItemID\\[766\\]Field').val());

有这样的“id”值有点问题，但我一直处于难以避免的情况。

edit — 请注意，您需要在字符串中使用两个反斜杠，以便 jQuery 选择器解释器可以“看到”它们；也就是说，你需要在字符串中留下一个反斜杠，而在 JavaScript 中这样做的方法是把反斜杠加倍 _{我讨厌解释这个}。

再次编辑 — 以下是 HTML 5 草案中关于“id”属性的内容：

3.2.3.1 id属性

id 属性指定其元素的唯一标识符 (ID)。 [DOMCORE]

该值在元素的主子树中的所有 ID 中必须是唯一的，并且必须包含至少一个字符。该值不得包含任何空格字符。

元素的唯一标识符可用于多种用途，最显着的是作为使用片段标识符链接到文档的特定部分的一种方式，作为一种在编写脚本时定位元素的方式，以及作为一种样式的方式来自 CSS 的特定元素。

标识符是不透明的字符串。不应从 id 属性的值中得出特定的含义。

没有关于“id”属性值的规则，换句话说，它们不能包含空格。

【讨论】：

@RoryMcCrossan 是的，抱歉，现在已修复。
非常感谢。我无权访问该应用程序的源代码，因此我无法更改 ID 的创建和使用方式；）我不能只使用它们！
@Pointy +1 关于 HTML5 中 id 的有趣说明。我从来没有猜到。老实说，我不喜欢 HTML5 与严格的 HTML5 相去甚远，因为我一直喜欢严格的严格性：P 只要你遵循它就不会出错，但了解一些变化总是好的。
@PaulP.R.O.同意 - 然而，我的经验是，例如，某些服务器端框架可能希望生成 <input> 元素，其“id”值与“name”属性匹配，此外还使用括号来处理向量/列表类型值。这很愚蠢，但有时必须让步，而浏览器历来是最让步的东西:-)

【解决方案2】：

您的 ID 无效，请参阅 this。

【讨论】：

谢谢，但我无权访问代码；）这是我老板购买的应用程序，源代码已加密......我修改它的唯一方法是使用JQuery。 ..

【解决方案3】：

改用document.getElementById("nItemID[766]Field").value。显然 jQuery 不支持带大括号的 id。

【讨论】：

该死！不知道如何在 jQuery 中转义字符，请查看 Pointy 的答案。

【解决方案4】：

那是无效的 HTML。 [ 和 ] 不是 id 中的有效字符。您可以像在输入元素上那样在名称中使用它们，但不能在 ids 中使用它们。

您应该将您的 id 更改为 nItemID_766_Field 之类的东西。然后它将是一个有效的 id，您可以轻松地更改每个 nItem 的数字。

编辑

正如 Pointy 指出的那样，它在 HTML 5 中有效。因此，除非您尝试符合 HTML 4，否则您不需要更改您的 id。

【讨论】：

谢谢，但我无权访问代码；）这是我老板购买的应用程序，源代码已加密......我修改它的唯一方法是使用JQuery。 ..
据我所知，HTML 5 规范没有对“id”属性值施加任何限制。
@JulieLaporte 加密源代码？太糟糕了......它是在PHP中吗？如果是这样，您可以围绕整个内容编写一个包装器，使用ob_start() 捕获输出。然后，您可以在 PHP 中修复错误的 HTML，然后再将其发送到浏览器。像 Tidy 这样的 PHP 扩展甚至可能有办法自动完成。我不确定，因为我从未为此使用过扩展名。别人现在可能。如果您想修复 HTML，也许您可以将其作为一个问题提出。
他不能使用 DOM 吗？我会认为说 JQuery 是唯一的出路是不正确的。
@PaulP.R.O.这很有趣:-)