1

正如我在网络上多次看到的那样，我正在使用 CSS 来设置复选框标签的样式。问题是 Firefox 在点击标签时表现得很奇怪。

如果在按住按钮的同时单击标签并移动（甚至轻微地）到一侧同时仍然停留在标签上，则不会选中该复选框。在我测试的所有其他浏览器（Chrome、Safari、IE）中，这工作得很好。Firefox 的这种行为很烦人，因为它有时会导致复选框没有按预期被选中，这是由于鼠标在选择时的轻微移动。

是我的错还是火狐的错？（或者在 Firefox 中这种行为背后是否有充分的理由？我对此表示怀疑。）

这是HTML：

<style>
.mycheckbox:checked + label {
    background: red;
}
.mycheckbox-label {
    border: 1px solid black;
    padding: 20px;
    cursor: pointer;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
</style>
<input type="checkbox" id="field1" class="mycheckbox" />
<label for="field1" class="mycheckbox-label">Click!Click!Click!</label>

PS 我刚刚意识到另一个奇怪的行为：WebKit 浏览器（即 Chrome 和 Safari）只有在您不使用按钮鼠标从填充到标签文本上移动时才会显示正确的行为，反之亦然。因此，它仅在您停留在填充上或停留在文本上时才有效。所以，IE 是唯一一个（在测试的）浏览器中真正获得正确行为的浏览器……更奇怪的是……</p>

PS 2. WebKit 浏览器中的另一个奇怪行为是，即使我设置了*-user-select: noneand ，它们在拖动时也会更改鼠标指针cursor: pointer。

4

0 回答 0