JavaScript:如何从复选框中删除"被按下"状态？

Question

我在mousedown复选框上覆盖了该事件,以便通过拖动其他复选框来启用选择.这涉及到必须执行event.preventDefault()以禁用默认文本选择行为.

除了一个令人讨厌的抽动之外,一切都正常工作,即复选框保持在"被按下"状态,直到我松开鼠标(如果不清楚,请尝试按住鼠标选中复选框以查看我的意思).

如何将复选框的状态恢复为完全关闭或完全打开(不是"按下")？

编辑:这是我的代码jsfiddle.

Answer 1

你可以做的是通过:active 伪类覆盖“复选框被按下”状态的一些CSS 。

\n\n

\xe2\x80\x8binput[type=checkbox]:active {\n    outline: none;\n    border: none;\n    /* etc...*/\n}\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\xe2\x80\x8b\n

\n\n

但是，这种方法只能让您为此状态定义自己的规则，而不能告诉浏览器在未触及的状态下呈现默认系统复选框。这当然不是万无一失的，但可能会满足您的情况。

\n\n

为了最大程度地控制外观，您需要实现自定义复选框组件或使用众多 UI 小部件库之一（例如 Dojo、ExtJS、UniformJS 等）。这些自定义小部件基本上隐藏了真实的小部件<input type="checkbox" />，为您提供了一个“假”元素进行交互（但模仿了本机 UI 控制功能，只是它完全可主题化）。

\n