Firefox：按下 Shift 或 CTRL 时未选中 JQuery-UI 复选框

Question

编辑：从 mark.hch 的回答中，我意识到这只是 Firefox 上的一个问题。为了澄清我在下面写的内容：我不是在寻求事件处理程序的帮助——这只是上下文。按住 shift 和 CTRL 键时，我特别需要复选框按钮才能在 Firefox 上工作。

我有一系列带有事件处理程序的 JQuery-UI 复选框设置并正常工作。我希望能够在按下 shift/CTRL 按钮的同时单击复选框时更改行为。问题是，当我在按住复选框的同时单击复选框时，实际上什么都没有发生。

在我看来，按钮被选中/突出显示，而不是被点击。按下 shift 键时如何停止此操作并注册单击？

例如：https://jsfiddle.net/51c72b20/

  <script>
  $(function() {
    $( "#format" ).buttonset();
  });
  </script>


<div id="format">
  <input type="checkbox" id="check1"><label for="check1">Alpha</label>
  <input type="checkbox" id="check2"><label for="check2">Bravo</label>
  <input type="checkbox" id="check3"><label for="check3">Charlie</label>
</div>

Answer 1

您可以使用 CSS 属性来禁用文本选择（请参阅：How to disable text selection highlighting using CSS?）。

将此 CSS 添加到您的 #format 元素中，如下所示：

#format{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

然后添加您的班次新闻跟踪：

var shiftDown = false;
$(document).on('keydown', function(e){
    if(e.which == 16 && !shiftDown){ shiftDown = true; }
});
$(document).on('keyup', function(e){
    if(e.which == 16 && shiftDown){ shiftDown = false; } 
});

最后添加您的点击方法并确定是否正在保持 shift：

$('#format label').on('click', function(){
    if(shiftDown){
        //$(this) was clicked while shift was down
    }
    else{
        //$(this) was clicked while shift was not down   
    }
});

最终结果：https://jsfiddle.net/55wpdp4d/

注意：最终结果在 Firefox 中的行为很奇怪，因为当您按住 shift 键并单击按钮时，它的行为不正常……将对其进行调查，但不承诺解决方案。