如何将复选框 onclick 事件传递给父 onclick？答案

【问题标题】：How can I pass checkbox onclick event to parent onclick?如何将复选框 onclick 事件传递给父 onclick？
【发布时间】：2010-05-03 20:30:50
【问题描述】：

我有一个 onclick 事件和 , 在里面。
当我点击复选框时，div-onclick 事件不会触发 - 我希望它触发而不必将 onclick 复制到复选框上。

<div id="id-tag" onclick="do()">
  <span>text</span>
  <img src="pic.jpg" />
  <input type="checkbox" name="mycheck" />
</div>

我知道 div-idtag，但最好避免在复选框内指定它。
在复选框 onclick 上使用另一个函数调用来调用父级不是我想要的，比如

onclick="run_parent_onclick()"

但这没关系（未经测试）

onclick="this.parent.click()"

【问题讨论】：

【解决方案1】：

您可以在输入的 onclick 中手动触发 div 的点击事件：

<input type="checkbox" name="mycheck" onclick="this.parentNode.click()" />

或

<input type="checkbox" name="mycheck" onclick="document.getElementById('id-tag').click()" />

【讨论】：

两者都有效，但前提是复选框未被禁用并且我将我的复选框设置为禁用以控制选中状态，因为 div onclick 功能可以取消，这意味着用户可以选中该框并取消复选框保持选中状态时的功能。我想我必须想点别的办法来防止这种情况发生。
请注意，DOM .click() 仅适用于 Safari 中的某些元素。

【解决方案2】：

使用 addEventListener：

function do(e) { ... }
document.getElementById('id-tag').addEventListener('click', do, true);

“真”使事件捕获。

【讨论】：

如何将复选框 onclick 事件绑定到父 div onclick 操作？我还有成百上千个这样的 div，这就是为什么我要寻找“全球”的东西作为我未经测试的例子。