javascript - JavaScript：如何从复选框中删除“被按下”状态？

Question

我正在覆盖mousedown复选框上的事件，以通过拖动其他复选框来启用选择。这涉及必须event.preventDefault()禁用默认文本选择行为。

一切正常，除了一个烦人的抽动，即复选框保持在“被按下”状态，直到我放开鼠标（如果不清楚，请尝试在复选框上按住鼠标以了解我的意思）。

如何将复选框的状态恢复为完全关闭或完全打开（不是“被按下”）？

编辑：这是我的代码的jsfiddle。

Answer 1

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

​input[type=checkbox]:active {
    outline: none;
    border: none;
    /* etc...*/
}​​​​​​

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

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