为什么父元素上的 preventDefault 禁用在单击时以编程方式检查子复选框？

问题描述

div 元素的点击事件以 e.preventDefault() 开头。这使得手动点击复选框 input 或其关联的 label 不再有效。

在更多 JavaScript 代码的帮助下，手动点击 label 会生成预期结果，因为该复选框现在以编程方式选中/取消选中。

然而，尽管已经实现了用于以编程方式检查/取消检查的类似 JavaScript 代码，但手动单击复选框 input 仍然不起作用。为什么？

document.querySelector('div').onclick = function (e)
{
      e.preventDefault();
      if (e.target.tagName.toUpperCase() == 'LABEL')
      {
          e.target.previousElementSibling.checked = !e.target.previousElementSibling.checked;
      }
      else if (e.target.tagName.toUpperCase() == 'INPUT')
      {
          e.target.checked = !e.target.checked;
      }
}

<div>
      <input  id="check" type="checkbox">
      <label for="check">Label Text</label>
</div>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

checkbox javascript preventdefault