javascript - 如何获取具有特定名称的所有输入？

Question

我有一个带有一堆文本输入的表单，如下所示：

<input type="text" name="option[]" value="option 1" onBlur="outputOptions()">
<input type="text" name="option[]" value="option 2" onBlur="outputOptions()">
<input type="text" name="option[]" value="option 3" onBlur="outputOptions()">

我希望能够获得所有输入的值，所以我尝试这样做：

function outputOptions()
{
    console.log("inside outputOptions");

        $("input[name=option]").each(
            function() {
                console.log("option value: " + $(this).value);
            }
        );
}

在我的站点上，结果是当我单击输入和输出文本输入时，我看到“在 outputOptions 内”，但没有打印出任何文本输入值。

我究竟做错了什么？

JSFiddle：http: //jsfiddle.net/6zguZ/2/

Answer 1

您以错误的方式获得价值：

    console.log("option value: "  + this.value);

如果你真的想使用 jQuery，你会这样做：

    console.log("option value: " + $(this).val());

但没有理由这样做。

您还需要使用实际名称进行选择：

 $('input[name="option[]"]').each(

jQuery 选择不匹配任何元素并不是错误，因此您不会收到类似的错误。

Answer 2

试试这个香草 JS：

var inputs = document.getElementsByName("option[]"), l = inputs.length, i;
for( i=0; i<l; i++) {
    console.log(inputs[i].value);
}

编辑：这是一个速度测试，说明为什么这比 jQuery 更好。