Javascript：如何从“动态”创建的复选框中获取值

Question

因此，我将根据数据库中的记录动态创建/呈现复选框。 当前，这是“显示”这些复选框的方法：

function formatBranch(branch) {
    return (
      "<p>\n" +
      "  <label>\n" +
      "  <input id=" + branch['name'] + " type=\"checkbox\" class=\"filled-in libraryCheckbox\">\n" +
      "  <span>" + branch['name'] + "</span>\n" +
      "  </label>\n" +
      "</p>"
    );
}

现在，我需要检查选中了哪些复选框，并检索那些/这些特定的复选框，因为我将使用它们来过滤搜索。 关于如何实现这一目标的任何想法？

谢谢你的帮助 ：）

Answer 1

要使用纯js获取所有复选框值：

let chks = document.getElementsByTagName("input");
for(var i = 0; i < chks.length; i++) {
  if(chks[i].type == "checkbox") {
    if (chks[i].checked) {
      // the checkbox is clicked
    } else {
      // checkbox is not clicked
    }
  }  
}

您可以使用它来构建过滤器数组或类似的东西

如果您想点击操作，请执行以下操作：

let chks = document.getElementsByTagName("input");
for(var i = 0; i < chks.length; i++) {
  if(chks[i].type == "checkbox") {
    chks[i].addEventListener('change', function(e){
      if (e.target.checked) {
        // clicked
      } else {
        // not clicked
      }
    });
  }  
}