JavaScript 循环

Question

我有一个 javascript 片段，它循环遍历所有输入（表中的所有行），如果在一行中选中一个复选框，它会检查所有行中的所有复选框。

我实际上需要它来检查同一行中的第二个复选框，而不是所有行，所以我需要编辑 javascript 片段，它会在其中递增

//loop through all inputs
            for(i = 0; i < inputs.length; i++) 

---

<script type="text/javascript">
var mainchecked = false;  

    function checkAll() {

        //get all input elements
        var inputs = document.getElementsByTagName('input');

        //if the box is being checked
        if(!mainchecked) {

            //loop through all inputs
            for(i = 0; i < inputs.length; i++) {
                //does it have autocheck?
                if(inputs[i].className == 'autocheck') {
                    //then check the box!
                    inputs[i].checked = "checked";  
                }
            }
            mainchecked = true;
        } else {
            //box is being unchecked, uncheck everything
            for(i = 0; i < inputs.length; i++) {
                inputs[i].checked = "";
            }
            mainchecked = false;
        }
    }
</script>

Answer 1

不要循环遍历所有输入，而是循环遍历表行并处理每行中的输入。以下代码假设该行的控制复选框位于该行中找到的第一个输入中，并且该功能适用​​的行中的所有其他复选框都将类别设置为“autocheck”；我将让您根据您的具体情况进行修改（例如，您可能需要检查是否 type=="checkbox"）。

我还没有对此进行测试，但它应该足以让您继续下去。

function checkAll(){
   var _rows = document.getElementById("yourTableID").rows;
   var i,
       j,
       isChecked,
       inputs;

   for (i=0; i < _rows.length; i++) {
      inputs = _rows[i].getElementsByTagName("input");
      isChecked = inputs[0].checked;
      for (j=1; j < inputs.length; j++) {
         if (inputs[j].className == "autocheck") {
            inputs[j].checked = isChecked;
         }
      }
   }

}

更新：刚刚在您的评论中看到您似乎是从控制复选框的 onclick 触发此功能。如果是这样，那么您可以将该复选框的引用传递给您的函数，然后仅处理它所在的行，如下所示：

<input ... onclick="checkAll(this);" ...>

function checkAll(cb){
       var _row = cb.parentNode.parentNode,
           j,
           isChecked = cb.checked,
           inputs;

          inputs = _row.getElementsByTagName("input");
          for (j=0; j < inputs.length; j++) {
             if (inputs[j].className == "autocheck") {
                inputs[j].checked = isChecked;
             }
          }
    }

Google“mdcparentnode”以获取更多信息。