中键点击事件

Question

我的 Chrome 扩展中有这段代码，因此我可以将 <div href="url"> 用作 link。这曾经按预期工作，直到最近。（左 - 在当前选项卡中打开，中间 - 在新选项卡中打开）。现在它只记录左键点击。

$('div.clickable-href').on('click', function(e) {
  switch(e.which) {
    case 1:
      window.location = $(this).attr('href');
      break;
    case 2:
      window.open($(this).attr('href'));
      break;
    case 3:
      break;
  }
});

我使用 <div href="url"> 和 <span href="url"> link，所以浏览器不显示状态栏。

我发现了一些类似的问题，但所有答案都建议使用 .on('mousedown', (e) => {...})。仅当 mousedown 事件后跟 mouseup 事件时，我才需要触发此事件。
更令人沮丧的是，这个 曾经有效 ，但现在不再有效了。

编辑：
这是 Chrome 55 的问题。在 Linux（我第一次注意到异常的地方）Chrome 已经更新到 v55。在我的 Windows 系统上，它是 v54，并且可以通过中键单击。从 54 更新到 55 导致了同样的问题。

Answer 1

我注意到 chrome 中的 鼠标按钮 #3 存在问题（未在其他浏览器上测试）。

所以这里有一个解决方法（添加 contextmenu 到触发事件）：

编辑
感谢 Matevž Fabjančičuse 的有用评论。

我确认自从 Chrome 55（我在一分钟前更新到它），鼠标中键点击现在触发新的 auxclick 事件。
所以一个click事件只能由鼠标按钮1触发。

注意 auxclick 是由鼠标按钮 2 和 3 触发的。

Reference here.

$('div.clickable-href').on('click auxclick contextmenu', function(e) {
    e.preventDefault();
    console.log(e.which);
    console.log(e.type);
    
    if(e.type=="contextmenu"){
       console.log("Context menu prevented.");
       return;
    }
                           
    switch(e.which) {
        case 1:
            //window.location = $(this).attr('href');
            console.log("ONE");
            break;
        case 2:
            //window.open($(this).attr('href'));
            console.log("TWO");
            break;
        case 3:
            console.log("THREE");
            break;
    }
});

.clickable-href{
    width:20em;
    background-color:#DDD;
    text-align:center;
    padding:4em 0;
    border-radius:8px;
}

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

<div class="clickable-href">
  CLICK ME - Test all 3 mouse buttons!
</div>

Answer 2

在 Linux Chrome 55 我发生了以下事件：

鼠标按钮 1：click
鼠标按钮 2：contextmenu
鼠标中键：auxclick

中键点击事件

Middle button click event

html

javascript

jquery

jquery-events