相关疑难解决方法(0)

Primer:可以将HTML复选框设置为indeterminate,既不选中也不选中.即使在这种不确定的状态下,仍然存在潜在的布尔checked状态.

单击不确定复选框时,它将失去其indeterminate状态.根据浏览器(Firefox),它还可以切换checked属性.

这个jsfiddle说明了这种情况.在Firefox中,单击其中一个复选框会导致它们切换其初始基础checked状态.在IE中,checked第一次单击时该属性保持不变.

我希望所有浏览器的行为都相同,即使这意味着额外的javascript.不幸的是,该indeterminate属性设置为false 之前的onclick处理(或onchange和jQuery change)被调用,所以我无法检测它是否就是所谓的上点击indeterminate复选框或没有.

该mouseup和keyup(用于空格键切换)事件显示之前indeterminate的状态,但我宁愿不那么具体:它似乎脆弱.

我可以在复选框(data-indeterminate或类似的)上维护一个单独的属性,但我想知道是否有一个我缺少的简单解决方案,和/或其他人是否有类似的问题.

注意：我使用 jQuery 访问 DOM 元素，但使用纯 JavaScript 将事件分配给它，所以我怀疑 jQuery 与它有什么关系

检查这个jsFiddle。

$(document).ready(function() {
  $('input')[0].indeterminate = true;
  $('input')[0].addEventListener("click", function(event) {
    console.log(event.target.checked)
    alert("Check is: " + event.target.checked);
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" checked>

如果您在 Chrome 上打开它并单击复选框，警报消息会显示“Check is: false”，而如果您在 Microsoft Edge 上打开它并单击复选框，消息会显示“Check is: true”，这意味着状态的check与浏览器性能的变化。

我尝试将checked属性与属性一起设置indeterminate，看看我是否强制它以相同的方式对待它，但结果是相同的

$(document).ready(function() {
  $('input')[0].indeterminate = true;
  $('input')[0].checked = false;

  $('input')[0].addEventListener("click", function(event) {
    console.log(event.target.checked)
    alert("Check is: " + event.target.checked);
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" checked>

这是 …