点击一个div,使用javascript切换其中的一个复选框 - 代码日志

点击一个div,使用javascript切换其中的一个复选框

这似乎是一个简单的问题,但我不会使用大量的JavaScript。

我有一个div,其中有一个复选框,并希望整个div切换复选框。这是我到目前为止

<div style="padding: 2em; border: 1px solid"
     onClick="if (document.getElementById('cb').checked) document.getElementById('cb').checked=false; else document.getElementById('cb').checked=true;">
  <input name="cb" id="cb" type="checkbox">
</div>

只有当您点击实际复选框时,才能切换两次,因此不会改变。

有任何想法吗?

您可以通过使用标签元素来包装您想要点击的区域,这样可以实现这个更强大和可访问的方式。例如。

<label for="cb">
    <div style="padding: 2em; border: 1px solid">
        <input name="cb" id="cb" type="checkbox">
    </div>
</label>

我没有测试过上述代码,但我相信所有的浏览器都支持点击标签来检查输入框。

http://stackoverflow.com/questions/584239/click-on-a-div-to-toggle-a-checkbox-inside-of-it-using-javascript

本站文章除注明转载外,均为本站原创或编译
转载请明显位置注明出处:点击一个div,使用javascript切换其中的一个复选框