如何将复选框值设置为等于Javascript对象

How to set checkbox value equal to Javascript object

本文关键字：Javascript 对象 设置 复选框      更新时间：2023-09-26

我想为列出的每个项目添加复选框，我使用each循环来呈现列表，因此，当我选中该特定列表项目的复选框并移动到购物车时，我想获得该项目对象作为复选框的值。

{{#each list}}
    <input type="checkbox" name="list" >
    <p>{{this.title}}</p>
{{/each}}
<button class="btn btn-primary" id="addToCart" >ADD TO CART</button>

现在，当我点击按钮时，我希望它返回选中复选框的对象（即，当选中列表项1时，点击按钮应返回列表项1，依此类推…）

注意：我想将复选框的值设置为等于列表项对象。

您需要将复选框的值设置为列表中项目的某个唯一标识符：

{{#each list}}
  <input type="checkbox" name="list" value="{{this.id}}" id="{{'list' + this.id}}" />
  <label for="{{'list' + this.id}}">{{this.title}}</label>
{{/each}}

（使用标签而不是段落可以让用户点击文本来选择或取消选择复选框，而不需要任何javascript）

然后，您可以在按钮触发的调用中使用以下代码来获取所有选中复选框的列表：

$.each($("input[name='list']:checked"), function() {
  //push the items to list or whatever you want
});

您可以尝试将整个对象设置为复选框值，但我没有尝试过，也不知道其影响：

<input type="checkbox" name="list" value="{{this}}" id="{{'list' + this.id}}" />
相关文章：