Question

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

$('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">作为链接，因此浏览器不会显示状态栏。

我发现了一些类似的问题，但所有答案建议使用.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

中键单击事件

2 个答案:

中键单击事​​件

2 个答案:

中键单击事件