如何为右键单击指定默认操作?

时间:2017-12-09 19:51:52

标签: javascript

不知道如何让它发挥作用,但我想这是学习过程的一部分... Bellow是带有两个链接的代码,需要重定向,第二个,常规...我想让两个链接上的鼠标操作相同(左键单击打开,中键单击打开,右键单击属性)。谢谢大家的意见。

<!DOCTYPE html>
<html>
<head>

</head>
<body>
<a id="googlelink" href="https://www.google.com">Google</a>
<hr>
<a href="https://www.google.com">Google</a>
<hr>

<script>

document.getElementById("googlelink").addEventListener("click", redirectToYahoo);
document.getElementById("googlelink").addEventListener("auxclick", redirectToYahooNewTab);
document.getElementById("googlelink").addEventListener("contextmenu", rightClick);


function redirectToYahoo() { // LEFT MOUSE CLICK
    window.location.href = "https://www.yahoo.com";
}

function redirectToYahooNewTab() { // MIDDLE MOUSE CLICK
    window.open('https://www.yahoo.com', '_blank');
}

function rightClick() { // RIGHT MOUSE CLICK
    event.preventDefault();
};

</script>
</body>

以下是来自@charlietfl的片段,完成了这项工作。

var link = document.getElementById('googlelink');

link.addEventListener("auxclick",function(e){
   if(e.button !==2){
      window.open('https://www.yahoo.com', '_blank');
   }else{
     e.preventDefault()
   } 
});

link.addEventListener('click', function(e){
 window.location.href = "https://www.yahoo.com";
});

link.addEventListener('contextmenu', function(e){
});

3 个答案:

答案 0 :(得分:0)

问题出在auxclick。需要检查使用了哪个鼠标按钮。

不确定您使用auxclick的原因...它的浏览器支持有限。

正常的点击监听器不会触发右键单击。事件名称也是contextmenu而不是oncontextmenu

var link = document.getElementById('test');

link.addEventListener("auxclick",function(e){
   if(e.button !==2){
      console.log('Aux normal');
       e.preventDefault();
   }else{
      console.log('Aux right click')
   } 
});

link.addEventListener('click', function(e){
  console.log('Normal click')// no log when right click
  e.preventDefault() // just for demo

})

link.addEventListener('contextmenu', function(e){
  console.log('Context menu')
  e.preventDefault() 

})
<a id="test" href="/questions">Stackoverflow Questions</a>

答案 1 :(得分:0)

不确定这是否解决了您的auxclick问题,但它会回答如何根据标题进行右键点击:

oncontextmenu更改为contextmenu。然后阻止默认事件:

document.getElementById("googlelink").addEventListener("contextmenu", rightClick);
    
function rightClick() {
    event.preventDefault();
    alert("Right click disabled");
    // do your stuff here
};
<button id="googlelink">googlelink</button>

答案 2 :(得分:0)

我希望这会有所帮助:

var link = document.getElementById("googlelink");

document.addEventListener('DOMContentLoaded', function(ev) {
  replace(ev);
}, false);

function replace() {
  link.href = "https://www.yahoo.com";
}
<a id="googlelink" href="www.google.com"> GOOGLE LINK </a>