javascript - 使用 JQuery 单击按钮选择多个列表项值

Question

我有一个与此类似的列表(具有任意数量的 li):

<ul>

 <li>
  <div class="box">
   <table>
    <tr>
     <td>Product 1</td>
     <td><input type="hidden" class="hiddenid" value="5" /></td>
     <td><input type="checkbox" value="yes" /></td>
    </tr>
   </table>
  </div>
 </li>


 <li>
  <div class="box">
   <table>
    <tr>
     <td>Product 2</td>
     <td><input type="hidden" class="hiddenid" value="6" /></td>
     <td><input type="checkbox" value="yes" /></td>
    </tr>
   </table>
  </div>
 </li>


</ul>

<input type="submit" id="submit" />

我需要使用 JQuery 循环遍历每个项目，并在单击 #submit 后通过选中的复选框收集每个项目的 #hiddenid 值(最终我会将此字符串传递到 php 页面和数据库)。

这是我对 JQuery 的尝试，但是作为一个相对初学者(即菜鸟)，我非常迷失......

<script>
$(document).ready(function() {

   $(".arrow").click(function() {

    var id = $.each("#stockyesno:checked").closest(".box").find(".hiddenid").val();

    alert(id);

  });


});
</script>

我希望有一种方法可以纠正我的 id 变量的遍历，这样它就不会变得更复杂......

我已经简化了问题，但我确信如果可以回答这个问题，我可以将答案扩展到更复杂的代码。

感谢您提前提供的帮助!

Answer 1

您正在尝试编写

var ids = $(".stockyesno:checked").map(function() {
    return $(this).closest(".box").find(".hiddenid").val();
}).get();
var idString = ids.join(',');

此代码使用普通的 jQuery 调用来获取选中的元素，然后调用 map method将复选框集转换为值字符串集。
然后它调用 get将 jQuery 字符串对象转换为普通数组。
最后，它调用 Javascript join 方法将数组转换为单个逗号分隔的字符串。