javascript - JQuery - 字符串列表

Question

在 JQuery 中，为什么我会得到information Undefined以下代码？

JS - 右侧部分未定义

var s = $("[name='CountAnswer']").val();

HTML

<input style="width:150px" type="text" id="CountAnswer_1_" name="CountAnswer[1]">
<input style="width:150px" type="text" id="CountAnswer_2_" name="CountAnswer[2]">
<input style="width:150px" type="text" id="CountAnswer_3_" name="CountAnswer[3]">

Answer 1

您正在使用相等比较，但您必须使用通配符，可能 j查询属性以开头， ^但上面的语句将给出第一个匹配元素的值。您可以使用 each 来遍历所有元素。

var s = $("[name^='CountAnswer']").val();

使用each()进行迭代。

现场演示

$("[name^='CountAnswer']").each(function(){
   alert($(this).val());
   //or
   alert(this.value);
});

编辑基于 OP 评论。用于获取所有匹配项的值。

现场演示

strValues = $("[name^='CountAnswer']").map(function(){  
   return this.value;
}).get().join(',');

Answer 2

因为您没有名称为 == 的元素CountAnswer。您需要指定一个特定的名称，例如：

$("[name='CountAnswer[1]']").val();

或者，您可以使用“Begins With”通配符 ( ^) 来匹配名称以 开头的所有元素CountAnswer：

$("[name^='CountAnswer']").val();

当然，这只会返回匹配集中第一个元素的值，因为这是val().

Answer 3

jsFiddle 演示

您应该为您的字符串值设置一个数组，然后在某些事件中使用 jquery 部分匹配选择器"starts with"(^)来迭代由您的姓名表示的输入列表。

演示html：

<input value="a" style="width:150px" type="text" id="CountAnswer_1_" name="CountAnswer[1]">
<input value="b" style="width:150px" type="text" id="CountAnswer_2_" name="CountAnswer[2]">
<input value="c" style="width:150px" type="text" id="CountAnswer_3_" name="CountAnswer[3]">
<br><input type="button" id="b" value="show string list" /><div id="console"></div>

演示js：

var stringList = [];
$('#b').click(function(){
 stringList = [];
 $("[name^='CountAnswer']").each(function(){
  stringList.push(this.value);
 });
 var c = $("#console");
 for( var i = 0; i < stringList.length; i++ ){
    var d = $("<div>");
    d.html(stringList[i]);
    c.append(d);
 }
 console.log(stringList);
});