Question

我试图使用jQuery从不同的select标签获取相同名称的值。

以下是HTML

<div class="row">      
  <div class="col-md-3">
    <h1><i class="fa fa-glass" aria-hidden="true"></i></h1>
    <select class="form-control SelectWine" id="SelectWine" name="SelectWine[]">
      <option value="1">Red</option> <option value="2">Green</option> <option value="3">White</option>                                             </select>
  </div>
  <div class="col-md-3">
    <h1><i class="fa fa-glass" aria-hidden="true"></i></h1>
    <select class="form-control SelectWine" id="SelectWine" name="SelectWine[]">
      <option value="1">Red</option> <option value="2">Green</option> <option value="3">White</option>                                             </select>
  </div>

</div>

以下是我在jQuery中访问的方式：

$('.SelectWine').each(function (index){
       var wineId=[];
        wineId.push($(this).val());
        console.log('Wid',wineId[0]);
        console.log('Wid',wineId[1]);
        console.log('Wid',wineId[2]);
   });

我正在获取控制台日志，如下所示

Wid 1
Wid undefined
Wid undefined
Wid 3
Wid undefined
Wid undefined

我猜每次它都超越了价值。但我需要将每个选择标记的值存储到一个数组中。

注意：第一个选择标签位于默认值（索引1），第二个选择第三个选项（索引3）。

此代码用于获取2或3种不同产品的用户输入并将其存储到cookie中以供进一步使用，但首先我需要将其存储为数组，然后我可以将其存储为cookie中的json数组。

我尝试通过元素的名称进行访问，但它只响应使用id访问。

我试了好几个小时，想不通办法。你的帮助会很棒!!

Answer 1

您需要在循环外声明数组，否则您将在每次迭代中创建一个新数组，并且由于范围而无法在each回调之外访问它。

var wineId=[];
$('.SelectWine').each(function (index){
       //now each iteration will push to same array
       ....

当您需要生成这样的数组时，您可以使用map()

var windeId = $('.SelectWine').map(function(){
    return this.value;
}).get();

Answer 2

主要问题是你在for each中声明了你的数组，所以它被覆盖了。在循环之外声明它。

此外，与您的问题无关：

您的选择元素具有相同的名称和ID。他们可以而且应该共享一个类名，但不能共享元素名称和id。
你可以使用'this.value'而不是'$（this）.val（）'。尽可能避免不必要地使用jQuery将提高性能。

https://jsfiddle.net/1ok6ymgf/

var wineId=[];
$('.SelectWine').each(function (index) {      
    wineId.push(this.value);
    console.log('Wid',wineId[0]);
    console.log('Wid',wineId[1]);
    console.log('Wid',wineId[2]);
});

Answer 3

让ids变得不同，并使用$('#id_name')在javascript中调用或使用相同的类名称并使用$('.class_name')

在javascript中调用

jQuery：从同名

3 个答案: