jQuery:preventDefault()不能处理输入/点击事件?

前端之家收集整理的这篇文章主要介绍了jQuery:preventDefault()不能处理输入/点击事件?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想在用户右键单击输入字段时禁用默认的contextMenu,以便我可以显示自定义的contextMenu.一般来说,通过执行以下操作非常容易禁用右键单击菜单
  1. $([whatever]).bind("click",function(e) { e.preventDefault(); });

事实上,除了FF中的输入字段之外,我可以在几乎所有元素上执行此操作 – 任何人都知道为什么或可能指向某些文档?

以下是我正在使用的相关代码,谢谢你们.

HTML:

  1. <script type="text/javascript">
  2. var r = new RightClickTool();
  3. </script>
  4.  
  5. <div id="main">
  6. <input type="text" class="listen rightClick" value="0" />
  7. </div>

JS:

  1. function RightClickTool(){
  2.  
  3. var _this = this;
  4. var _items = ".rightClick";
  5.  
  6. $(document).ready(function() { _this.init(); });
  7.  
  8. this.init = function() {
  9. _this.setListeners();
  10. }
  11.  
  12. this.setListeners = function() {
  13. $(_items).click(function(e) {
  14. var webKit = !$.browser.msie && e.button == 0;
  15. var ie = $.browser.msie && e.button == 1;
  16.  
  17. if(webKit||ie)
  18. {
  19.  
  20. // Left mouse...do something()
  21.  
  22. } else if(e.button == 2) {
  23. e.preventDefault();
  24.  
  25. // Right mouse...do something else();
  26. }
  27.  
  28. });
  29. }
  30.  
  31. } // Ends Class

编辑:

对不起,在阅读评论后,我意识到我应该澄清一些事情.

1)从某种意义上说,上面的代码确实有效.代码能够对单击的按钮进行排序,它只是不关心我说e.preventDefault()并且仍然弹出右键单击菜单.换句话说,如果你在e.button上发出警告,你会得到你的1或0左边和2右边…但它只是嘲笑我,仍然显示该死的默认菜单

2)如果我将jQuery选择器放在任何其他元素(输入除外)上,那么一切都会正常工作,FF将尊重preventDefault()调用,默认的右键单击菜单不显示.

解决方法@H_404_26@
一种跨浏览器的解决方案,用于禁用默认上下文菜单
  1. window.oncontextmenu = function() { return false };

要仅在给定元素内捕获contextmenu事件,请使用:

  1. document.getElementById('myElement').oncontextmenu=function(){
  2.  
  3. // Code to handle event
  4. return false;
  5. }

如果您尝试使用oncontextmenu以外的方法来中断右键单击事件,则会根据确切的事件场景和浏览器获得不同的结果.

在jQuery中:

  1. $('myElement').bind('contextmenu',function(){
  2.  
  3. // Handle right-click event.
  4. return false;
  5. });

您还可以使用jQuery的event.which来确定按下了哪个按钮,但您仍然必须取消默认的contextmenu事件:

  1. // Cancel default oncontextmenu event.
  2. $(element).bind('contextmenu',function(){ return false });
  3.  
  4. $(element).mousedown(function(event){
  5.  
  6. switch (event.which)
  7.  
  8. case 1:
  9. // Left mouse
  10. break;
  11.  
  12. case 2:
  13. // Middle mouse
  14. break;
  15.  
  16. case 3:
  17. // Right mouse.
  18. break;
  19.  
  20. });

我在IE6(Wine下),Chrome 11,Firefox 3.6,Opera 11和Safari中测试了这个.

猜你在找的jQuery相关文章