【问题标题】:jquery right mouse click div [duplicate]jquery鼠标右键单击div [重复]
【发布时间】:2012-12-17 14:52:02
【问题描述】:

可能重复:
How to distinguish between left and right mouse click with jQuery

当我在 div 内单击鼠标右键时如何打开上下文菜单。因为当我在 div 内用鼠标右键单击时,它会淡出?

Javascript

$("#link").click(function(e){
   e.stopPropagation();
   div = $("#mydiv").fadeToggle(300);
});

$("#mydiv").click(function(e){
   e.stopPropagation();
});

$(document).click(function(e){
   $('#mydiv').fadeOut(200);
});

HTML

<a id="link">Click</a>
<div id="mydiv" style="width: 200px; height: 200px;">Hello</div>

更新:

Javascript

$("#link").click(function(e){
   e.stopPropagation();
   div = $("#mydiv").fadeToggle(300);
});

$("#good_buttom").click(function(e){
   e.stopPropagation();
   div = $("#hide").fadeToggle(300);
});

$("#mydiv").mousedown(function(e) {
switch (e.which) {
    case 1:
         e.stopPropagation();
         $('#mydiv').fadeOut(200);
        break;
    case 2:
        alert('2');
        break;
    case 3:
        alert('3');
        break;
    default:
        alert('You have a strange mouse');
}
});

HTML

<a id="link">Click</a>
<div id="mydiv" style="width: 200px; height: 200px;">
    <button id="good_button">Click IT</button>
    <div id="hide" style="display:none;">Show up.</div>
</div>

【问题讨论】:

  • 嗨,我在看这篇文章,但不明白...我是 jquery 的新手...有什么帮助吗?

标签: jquery right-click


【解决方案1】:

click 只能通过鼠标左键触发,而mousedown 可以通过鼠标左键/中键/右键触发。因此,只需在您的代码中将click 替换为mousedown,并通过检查event.which 来区分左/中/右键单击。示例请查看How to distinguish between left and right mouse click with jQuery

顺便说一句:检查此link 可以帮助您了解clickmousedownmouseup 事件之间的关系。这篇文章:Javascript Madness: Mouse Events 或许也有帮助。根据经验,当您需要对鼠标事件进行更多控制时,最好处理像 mousedownmouseup 这样的低级别事件,而不是像 clickdblclick 这样的高级别事件。

还有一个问题是您在 HTML 中在mydiv 之前添加了一个多余的“#”。

更新:根据您的新要求,您可以添加以下代码以避免事件传播。

$("#good_button").mousedown(function(e) {
    e.stopPropagation(); // avoid triggering its parent
    div = $("#hide").fadeToggle(300);
});

【讨论】:

  • 感谢您的回复,我做了但不能正常工作。我在 div 里面有一个按钮,当我想点击它时,div 淡出...所以 mousedown 不好?
  • 刚刚发现您在 HTML 中的 mydiv 之前多了一个“#”。
  • 请帮助我...因为我迷路了..
  • 我改了谢谢 :) 我只是写在这里没有复制.. 但还是不行
  • 我刚刚更新了我的答案。
猜你喜欢
  • 1970-01-01
  • 2014-07-10
  • 2014-01-03
  • 1970-01-01
  • 1970-01-01
  • 2013-05-07
  • 2011-01-17
  • 1970-01-01
  • 2011-05-30
相关资源
最近更新 更多