javascript - 获取复选框值并显示它们

Question

我想显示复选框选中项目的值(value)。 这是我的js。在控制台中变得不确定。如何解决这个问题。

http://jsfiddle.net/bmtx4ykc/

$(document).ready(function() {
  $("#checkAll").change(function() {
    $("input:checkbox").prop('checked', $(this).prop("checked"));
  });
  $('#submitButton').click(function() {
    var values = $("#add input[name=chkboxName]:checked").map(function() {
      row = $(this).closest("tr");
      return {
        id: $(this).val(),
        name: $(row).find("#name").text(),
        quantity: $(row).find("#quantity").text()
      }
    }).get();
    $('#result').append(values.name);
    console.log(values.name);
  });
});

Answer 1

这是因为map() method正在返回一个对象数组。

你得到 undefined 因为你试图访问数组的 name 属性。您需要访问数组中对象的 name 属性。

例如，如果选择了第三行，则 values[0] 将返回以下内容:

console.log(values[0]);
// Object {id: "2", name: "Orange", quantity: "6"}

console.log(values[0].name);
// "Orange"

您可以简单地遍历数组中的项目以记录每个对象的 name 属性:

Updated Example

values.forEach(function (row) {
    console.log(row.name);
});

---

作为旁注，id 属性值在文档中必须是唯一的。请改用类。