Question

关于选择所有复选框，我已经阅读了很多关于SO的其他问题，但找不到一个说明如何触发其他复选框操作的问题。

我有一个主复选框，当选中此复选框时，也会选中所有其他复选框。问题是，其他复选框必须执行自己的操作，例如，如果选中/取消选中它们，则禁用文本字段.etc。我通过向每个复选框添加onclick实现了这一点。那么如果选中主复选框，如何调用每个复选框（或让每个复选框执行其操作）？

在阅读完本文后，我做了以下内容：

      // main checkbox functin that checks/unchecks other checkboxes. 

  function toggleAllCheckBoxes(source , operationType) {
                checkboxes = document.getElementsByName("checkBox" + operationType);
                for each(var checkbox in checkboxes)
                checkbox.checked = source.checked;
               // checkbox.addEventListener('click', true); // this is wrong.
            }


  //this will toggle text fields enabled/disabled
 function toggleDisable(oldTable, newTable , checkBox)
    {
        if( document.getElementById(newTable) !=null)// in case to toggle only old table
        {
            document.getElementById(newTable).disabled = checkBox.checked;
        }

        document.getElementById(oldTable).disabled = checkBox.checked;
    }

主要复选框：

All<input type="checkbox" onClick="toggleAllCheckBoxes(this , '<?=$operationType?>')"/>

其他复选框

  X<input name="checkbox" id="checkbox" onclick="toggleDisable('<?= $originalTableId?>' , '<?= $backupTableId?>' , this )" type="checkbox" />

到目前为止，此工作正常，但如果选中main复选框，则不会启用/禁用文本字段。虽然单个复选框能够做到这一点。

感谢。

Answer 1

我看到两个问题：

JavaScript中没有for each运算符。你需要使用一个这里循环正常。
您不想设置checked属性对于复选框，因为，正如您所见，这将绕过所有事件处理程序。相反，在复选框上调用click()即可选中（或取消选中）并调用所有事件处理程序。

最终会在toggleAllCheckBoxes中看起来像这样：

for(var i = 0; i < checkboxes.length; i++)
    checkboxes[i].click();

以下是试用此代码的小提琴：http://jsfiddle.net/z4Ltc/

选中/取消选中主复选框时，触发其他复选框onclick（）

1 个答案: