Question

我正在使用以下功能对切换复选框进行分组。

<script type=text/javascript>
function toggle(source, wild_name) {
  checkboxes = document.getElementsByName(wild_name);
  for(var i in checkboxes)
    checkboxes[i].checked = source.checked;
}
</script>

因此，当我点击一个定义为：

的复选框时

<input type="checkbox" onchange="toggle(this, 'tweak_os')" name="toggle_tweak_os"> Toggle All

它会检查名为“tweak_os”的任何复选框。但我试图这样做，以便如果一个复选框调用检查另一个复选框的函数，则应该执行相同的函数。在以下代码中：

<input type="checkbox" onchange="toggle(this, 'toggle_tweak_os')" name="toggler">
<input type="checkbox" onchange="toggle(this, 'tweak_os')" name="toggle_tweak_os">
<input type=checkbox id=tweak_os_1 name=tweak_os value=tweak_os_1>

我希望在点击第一个名为“toggler”的复选框时检查名为“tweak_os”的最后一个复选框。

Answer 1

第一个复选框更改导致选择第二个但不是第三个，因为当使用代码更改时不会触发非第二个复选框的更改。如果已定义，则需要使用代码触发复选框的更改事件。

function toggle(source, wild_name) {
    checkboxes = document.getElementsByName(wild_name);
    for (var i in checkboxes) {
        checkboxes[i].checked = source.checked;
        if (typeof checkboxes[i].onchange == "function") {
            checkboxes[i].onchange();
        }
    }
}

Answer 2

尝试触发复选框的onchange功能（如果存在），

if (checkboxes[i].onchange) checkboxes[i].onchange();

DEMO： http://jsfiddle.net/wDBxb/

function toggle(source, wild_name) {
    checkboxes = document.getElementsByName(wild_name);
    for (var i in checkboxes) {
       checkboxes[i].checked = source.checked;
       if (checkboxes[i].onchange) checkboxes[i].onchange();
    }   
}

复选框标记复选框递归

2 个答案: