javascript - Jquery 读取编号组中选择下拉列表的数组

Question

我有一系列选择下拉列表:

<select name="item[1]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>
<select name="item[2]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>
<select name="item[3]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>
<select name="item[4]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>

我正在尝试使用 Jquery 解析它们。名称中的数字由我的数据库中该项目的 ID 号填充。我基本上想解析每一个，如果是，则使用 ID 从数据库中获取该商品的价格来计算总计。这对于 Jquery 来说是可能的吗？我可以毫无问题地完成其余的代码，我只需要帮助解析所有 item 并返回每个项目的值和 ID。

Answer 1

我会使用 jQuery attribute starts with selector ，并与 .map() 结合获取您选择的项目的列表。

这是一个可运行的代码片段，它在单击按钮后返回选定项目的数组。您可以获取商品 ID 并生成价格。

$("button").on("click", function() {
  var ids = $('select[name^="item"]').map(function() {
    if ($(this).val() === "Yes")
      return this.name.replace(/\D/g,'');
    else 
      return null;
  }).toArray();
  
  alert(ids);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select name="item[1]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>
<select name="item[2]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>
<select name="item[3]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>
<select name="item[4]">
    <option value="No">No</option>
    <option value="Yes">Yes</option>
</select>
<button>Get Price</button>