我正在覆盖mousedown
复选框上的事件,以通过拖动其他复选框来启用选择。这涉及必须event.preventDefault()
禁用默认文本选择行为。
一切正常,除了一个烦人的抽动,即复选框保持在“被按下”状态,直到我放开鼠标(如果不清楚,请尝试在复选框上按住鼠标以了解我的意思)。
如何将复选框的状态恢复为完全关闭或完全打开(不是“被按下”)?
编辑:这是我的代码的jsfiddle。
我正在覆盖mousedown
复选框上的事件,以通过拖动其他复选框来启用选择。这涉及必须event.preventDefault()
禁用默认文本选择行为。
一切正常,除了一个烦人的抽动,即复选框保持在“被按下”状态,直到我放开鼠标(如果不清楚,请尝试在复选框上按住鼠标以了解我的意思)。
如何将复选框的状态恢复为完全关闭或完全打开(不是“被按下”)?
编辑:这是我的代码的jsfiddle。
您可以做的是通过:active 伪类覆盖“复选框被按下”状态的一些 CSS 。
input[type=checkbox]:active {
outline: none;
border: none;
/* etc...*/
}
然而,这种方法只会让您为这种状态定义自己的规则,而不是告诉浏览器在其未触及状态下呈现默认系统复选框。这当然不是万无一失的,但在您的情况下可能会令人满意。
为了最大限度地控制外观,您需要实现自定义复选框组件或使用众多 UI 小部件库之一(如 Dojo、ExtJS、UniformJS 等)。这些自定义小部件基本上隐藏了真实的<input type="checkbox" />
内容,为您提供了一个“假”元素进行交互(但它模仿了本机 UI 控件功能,只是它是完全可主题化的)。