如何获取 ID 中包含方括号的表单元素的值？ [复制]答案

【问题标题】：How do I get the value of a form element that has brackets in the ID? [duplicate]如何获取 ID 中包含方括号的表单元素的值？ [复制]
【发布时间】：2012-03-14 14:04:57
【问题描述】：

可能重复：
Find DOM element by ID when ID contains square brackets?

我无法获得有些疯狂的表单元素的价值。例如，我有一个 HTML 表单元素“必须”具有“data[User][notify_one_day_out]”的名称。问题是我无法获取表单元素的值。

<label for="data[User][notify_one_day_out]">One day away:</label>
<select name="slider" id="data[User][notify_one_day_out]" data-role="slider">
    <option value="0">OFF</option>
    <option value="1" selected="selected">ON</option>
</select>

然而

alert( $("#data[User][notify_one_day_out]").val());

显示为未定义。有什么帮助吗？

【问题讨论】：

在 ID 中，而不是名称中。阅读此stackoverflow.com/questions/1239095/…
括号在 id 中无效 - stackoverflow.com/questions/70579/…。不确定您是否能够完成这项工作。

标签： javascript jquery

【解决方案1】：

用\\转义

$("#data\\[User\\]\\[notify_one_day_out\\]")

【讨论】：

【解决方案2】：

你必须转义括号：jsFiddle

alert( $("#data\\[User\\]\\[notify_one_day_out\\]").val());

一个反斜杠用于正则表达式一个用于 Javascript 以转义反斜杠；）

jQuery 使用sizzle 作为选择器引擎，由一些非常高科技的正则表达式驱动。

编辑 nnnnnn：我不是 jQuery 内部工作的专家，但是按照源代码中的面包屑导航对我来说确实像 RegExps

1) jQuery 调用$.fn.init(selector)

var jQuery = function( selector, context ) {
        // The jQuery object is actually just the init constructor 'enhanced'
        return new jQuery.fn.init( selector, context, rootjQuery );
    }

2) 在所有特殊情况之后，init 使用 quickExpr.exec( selector )

init: function( selector, context, rootjQuery ) {
        ...
    match = quickExpr.exec( selector );

3) quickExpr 似乎是它进入 RegExp 领域的地方，之后我不知道另一边会出现什么。

quickExpr = /^(?:[^#<]*(<[\w\W]+>)[^>]*$|#([\w\-]*)$)/

【讨论】：

您对转义括号和转义反斜杠绝对是正确的，但是您传递给 jQuery 函数的字符串与正则表达式无关（即使 jQuery/sizzle 对 some 使用正则表达式 的实现）。
@nnnnnn 我在对帖子的编辑中分解了我的思考过程。我错过了什么吗？如果它“与正则表达式无关”，那么为什么转义斜杠？
jQuery/sizzle 正在使用正则表达式来处理您提供的选择器，它没有将选择器用作正则表达式。正则表达式语法与 CSS/jQuery 选择器语法完全不同。需要转义斜线，因为方括号在选择器语法中具有含义（不同对正则表达式语法中的方括号的含义），因此当您需要实际的括号字符时需要对括号进行转义。请注意，您还可以使用$("<div>") 之类的html 字符串调用jQuery 函数，jQuery 对它的处理与$("div") 完全不同...
你确定吗？你是对的，到目前为止，选择器还没有在正则表达式中使用，但是我在源代码中看到很多地方，从选择器生成的东西变成了正则表达式 quickParse = function( selector ) { ... new RegExp( "(?:^|\\s)" + quick[3] + "(?:\\s|$)" ) 例如。并不是说我完全可以跟踪该文件中正在执行的操作，只是说不只是文字 RegExp 声明。
是的，我确定。 jQuery 的选择器语法（或多或少）与 CSS 选择器语法相同，与正则表达式语法完全无关。 jQuery 可能会使用正则表达式来查找选择器中需要特殊处理的部分，并且可能会将其中一些部分插入到其他动态生成的正则表达式中以进行进一步处理，但这就是我最初所说的......

【解决方案3】：

$(document.getElementById('data[User][notify_one_day_out]')).val()

【讨论】：

【解决方案4】：

您似乎只有一个名为“slider”的选择，因此您可以使用属性等于选择器$('select[name="slider"]') 解决无效的 id。

【讨论】：

【解决方案5】：

尝试使用 \ 进行转义我确实记得这样的事情

更新

我想我们已经有了 Cheery 评论的解决方案

find Dom element by I'd containing square brackets

【讨论】：