Jqueryを使用して、マウスイベントのさまざまなクリックタイプを区別する方法を探しています。私はこの小さなプラグインで動作するようになりました。私はそれについてのフィードバックを得たいと思います。
主な困難は、マウスの右ボタンの「クリック」や「マウスダウン」などのDOMイベントをエミュレートすることでした。
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);
回答:
回答№1は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;
});
});