使用Javascript

Question

这是我的代码，用于检查具有相同ID的复选框

<input type="checkbox" name="MassApprove" value="setuju2"  />
<input type="checkbox" name="MassApprove" value="setuju3"  />
<input type="checkbox" name="MassApprove" value="setuju4"  />
<input type="checkbox" name="MassApprove" value="setuju5"  />
<input type="submit" value="Next Step" name="next" />

这是我的javascript代码。当触发此功能时，我需要选中此复选框。救救我！..

    function doMassApprove(massApproveFlag) {
        var confirmAlert = confirm("Do You Need Mass Approve !..");
        var massApprove = document.getElementById("MassApprove").length();
        if (confirmAlert == true) {
            //alert(massApproveFlag);
            for (var i = 0; i < massApprove; i++) {
                document.getElementById("MassApprove").checked = true;
            }
        } else {
            document.getElementById("headerMassApprove").checked = false;
        }
    }

Answer 1

HTML中的ID必须是唯一的。

由于您已指定名称MassApprove，请使用Document.getElementsByName()，

  

返回（X）HTML文档中具有给定名称的nodelist集合。

您可以使用简单的for循环

进行迭代

function doMassApprove(massApproveFlag) {
    var confirmAlert = confirm("Do You Need Mass Approve !..");

    if (confirmAlert) {
        //Get elements with Name
        var massApproves = document.getElementsByName("MassApprove");

        //Iterate and set checked property
        for (var i = 0; i < massApprove.length; i++) {
            massApproves[i].checked = true;
        }
    } else {
        document.getElementById("headerMassApprove").checked = false;
    }
}

Answer 2

1. 您没有相同的ID，因为ID必须是唯一的。你有相同的名称，这很好。 -
2. 不要为名称使用getElementById，而是使用document.getElementsByName，它将返回一个可以循环的集合

喜欢这个

function doMassApprove(massApproveFlag) {
    var massApprove = confirm("Do You Need Mass Approve !..");
    if (massApprove) {
      var checks = document.getElementsByName("MassApprove");
      for (var i=0; i < checks.length; i++) {
          checks[i].checked = massApprove; // or perhaps massApproveFlag?
      }
    }
    else {
      document.getElementById("headerMassApprove").checked = false;
    }
}

Answer 3

只是为了它，你可以使用一些现代浏览器的优点：

Array.prototype.forEach.call(document.querySelectorAll('[name=MassApprove]'), function(cb){cb.checked = true});

并使用箭头功能：

 Array.prototype.forEach.call(document.querySelectorAll('[name=MassApprove]'), cb => cb.checked=true);