2013-05-14 34 views
1

我正在尋找一種方法來區分jquery鼠標事件中的不同點擊類型。我結束了這個小插件,似乎工作。我想獲得一些反饋意見。jQuery RightClick處理程序插件

主要困難是模擬DOM事件,如鼠標右鍵的「click」或「mousedown」。

if(jQuery) (function(){ 

    $.extend($.fn, { 

     rightClick: function(handler) { 
      $(this).each(function() { 
       $(this).on("rightclick", function(e,event) { 
        handler(event); 
       }); 
      }); 
      return $(this); 
     },  

     rightMouseDown: function(handler) { 
      $(this).each(function() { 
       $(this).on("rightmousedown",function(e,event) { 
        handler(event); 
       }); 
      }); 
      return $(this); 
     }, 

     rightMouseUp: function(handler) { 
      $(this).each(function() { 
       $(this).on("rightmouseup",function(e,event) { 
        handler(event); 
       }); 
      }); 
      return $(this); 
     }, 

     leftClick: function(handler) { 
      $(this).each(function() { 
       $(this).on("leftclick", function(e,event) { 
        handler(event); 
       }); 
      }); 
      return $(this); 
     },  

     leftMouseDown: function(handler) { 
      $(this).each(function() { 
       $(this).on("leftmousedown",function(e,event) { 
        handler(event); 
       }); 
      }); 
      return $(this); 
     }, 

     leftMouseUp: function(handler) { 
      $(this).each(function() { 
       $(this).on("leftmouseup",function(e,event) { 
        handler(event); 
       }); 
      }); 
      return $(this); 
     }, 

     noContext: function() { 
      $(this).each(function() { 
       $(this)[0].oncontextmenu = function() { 
        return false; 
       } 
      }); 
      return $(this); 
     } 

    }); 
    $(document).on({ 
     click:function(e){ 
      $(e.target).trigger("leftclick",e); 
      e.stopPropagation(); 
     }, 
     mousedown:function(e){ 
      if(e.button == 0){ 
       $(e.target).trigger("leftmousedown",e); 
      } 
      if(e.button == 2){ 
       $(e.target).trigger("rightmousedown",e); 
      } 
      e.stopPropagation(); 
     }, 
     mouseup:function(e){ 
      if(e.button == 0){ 
       $(e.target).trigger("leftmouseup",e); 
      } 
      if(e.button == 2){ 
       $(e.target).trigger("rightmouseup",e); 
      } 
      e.stopPropagation(); 
     }, 
     contextmenu:function(e){ 
      $(e.target).trigger("rightclick",e); 
      e.stopPropagation(); 
      return false; 
     } 
    },"*"); 
})(jQuery); 

回答

2

試試這個:

$(document).ready(function(){ 
    document.oncontextmenu = function() {return false;}; 

    $(document).mousedown(function(e){ 
    if(e.button == 2) { //2 for Right Click, 3 for mouse wheel click 
     alert('Right mouse button!'); 
     return false; 
    } 
    return true; 
    }); 
}); 

jsFiddle

+0

更簡單......偉大的解決方案 – 2015-08-16 16:28:54