jQuery选择名称为数组的输入元素

Question

我用谷歌搜索了半个小时，但找不到解决方案，但我认为这应该很简单。

这是我的代码

<input name="order[name]" id="order[name]" type="text">

<script>
    $(document).ready(function(){
        $("#previewForm").click(function(){
            var orderName = $("input[type=text][name='order[name]']").val();
            $( "#contactCollected" ).text( orderName );
        });
    });
</script>

我希望用户预览他刚刚填写的表单。

替换

$( "#contactCollected" ).text( orderName );

与

$( "#contactCollected" ).text( 'some text' );

工作，所以我认为这是选择器的问题。如有需要，我可以提供更多代码。

编辑： 看来这是按原样工作的，我什至不确定我在这个过程中的哪个地方用另一个错误替换了一个错误。

感谢 cmets 中的所有人，尤其是 @Barmar 和 @Jonathan.Brink。

由于讨论了在输入元素中命名 ID，我不会删除该问题，但我不确定规则。

感谢大家的宝贵时间，我再次为没有立即试用 jsfiddle 表示歉意。

Answer 1

将“类型”从“文本”更改为“输入”并删除显式“类型”声明：

<input name="order[name]" id="order[name]" />

$("input[type=input][name='order[name]']")

除此之外，关于用于 dom 属性的字符的注释：

对于 HTML5 之前的版本，如果您在属性中使用方括号，例如 id 和 name，则会出现不稳定的行为。

ID 和 NAME 标记必须以字母 ([A-Za-z]) 开头，并且可以是 后跟任意数量的字母、数字 ([0-9])、连字符 ("-")、 下划线（“_”）、冒号（“:”）和句点（“.”）。

不过，您也许可以使用 HTML5 doctype 摆脱括号：

HTML 5 更加宽容，只是说 id 必须包含 at 至少一个字符，并且不能包含任何空格字符。

更多详情：What are valid values for the id attribute in HTML?

我建议为您的 id 提供不同的命名方案，这样您的选择器会更直接。

多属性选择器示例：https://api.jquery.com/multiple-attribute-selector/

Answer 2

试试这个

<script>
    $(document).ready(function(){
        $(document).on('click',"#previewForm",function(){
            var orderName = $("input[name='order[name]']").val();
            $( "#contactCollected" ).text( orderName );
        });
    });
</script>

Answer 3

我在这里练习线程死灵术，所以提前道歉。该主题在搜索中返回，但缺少可用的答案，因此我希望能够使后面的人受益。

上面带方括号的元素需要的选择是： $('#order\\[name\\]').val()

感谢以下线程： How do I get jQuery to select elements with a . (period) in their ID?

Answer 4

更改 - <input name="order[name]" id="order[name]" type="text"> 到 <input id="order_name" type="text"> - （此处不允许使用方括号，如果指定 I，则不需要名称 - 确保 ID 是唯一的）。

使用-$("input#order_name").val();访问