javascript - 在 Firefox 中，设置 checkbox.disabled = false 后 click() 不会立即运行

Question

我正在为 Apache Wicket 页面编写一些 Javascript，并尝试创建一个“全选”复选框，选中该复选框后，将选中所有其他复选框，然后禁用它们。同样，取消选中时，它将启用和取消选中所有复选框。此复选框不会被其余复选框更新(也就是说，选择所有其他复选框将不会选择“全选”框)。

我可以使用 checkbox.checked = selectAll.checked 完成我想要的任务，但它似乎没有传递单击事件，而我需要在 Wicket 中实现某些功能。使用 checkbox.click() 为我提供了我需要的点击事件，但在重新启用复选框后似乎没有运行。

var selectAll = document.getElementById("all");

function checkbox_changed() {
  checkboxes = document.getElementsByName('foo');

  for (var i in checkboxes) {
    var checkbox = checkboxes[i];

    checkbox.disabled = false;

    if (checkbox.checked !== selectAll.checked) {
      //checkbox.checked = selectAll.checked;
      checkbox.click();
    }

    if (selectAll.checked) {
      checkbox.disabled = true;
    }
  }
}

<form>
  <input type="checkbox" id="all" onchange="checkbox_changed()">Select All
  <br>
  <br>
  <input type="checkbox" name="foo">One
  <br>
  <input type="checkbox" name="foo">Two
  <br>
  <input type="checkbox" name="foo">Three
  <br>
  <input type="checkbox" name="foo">Four
  <br>
</form>

如果它更容易，这里是上面的jsfiddle:https://jsfiddle.net/ytggu5as/

编辑:我刚刚意识到这只发生在 Firefox 中(我使用的是 39.0)并更新了问题。在 Chrome 和 Safari 中似乎没问题(没有测试过其他任何版本)。知道为什么会发生这种情况以及如何解决它吗？如果没有，是否有比仅使用 .checked 更好的 .click() 替代方案？

Answer 1

重新启用复选框后调用 click() 不起作用的事实似乎是 bug in Firefox .

您可以通过在第一遍中设置 disabled=false 来解决该错误，然后在 setTimeout(..., 0) 中再次迭代复选框并根据需要调用 click()。