How do you disable click events from the contextme

问题:

When using ctrl+ click to fire a contextmenu event (Context.JS) in Safari on Mac OS 10.9, the mousedown/up/click events also fire. This causes the menu to be closed. The events seem to occur asynchronously in relation to one another, so stopPropagation doesn't work and this also seems to result in intermittent behaviour, sometimes it's fine sometimes it's not.

Has anyone else come across this problem, if so did you & how did you resolve it / work around it?

Unfortunately I'm not in a position to release the code to the masses, but I am hoping it sounds familiar to somebody out there.

fiddle: http://jsfiddle.net/gnh2tuyj/

回答1:

You could make use of the ctrlKey property of the MouseEvent :

var div = document.querySelector('div');
div.addEventListener('click', function(e) {
  if (e.ctrlKey) return;
  e.preventDefault();
  alert('click!');
}, false);

div.addEventListener('contextmenu', function(e) {
  e.preventDefault();
  alert('context menu!');
}, false);

div {
  border: 1px solid red;
}

<div>hold ctrl+click in safari, chrome, etc</div>

So if you want to patch the context.js yourself, just add if(ctrlKey) return; l24.

l23    $(document).on('click', 'html', function (e) {
l24    if(e.ctrlKey) return;
l25    $('.dropdown-context').fadeOut(options.fadeSpeed, function(){
l26     $('.dropdown-context').css({display:''}).find('.drop-left').removeClass('drop-left');
l27     });
l28    });

patched script : http://pastebin.com/6ySveRty

回答2:

Are you trying to block against people copying specific sets of text or general content?

ID/ELEMENT/CLASS {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

maybe this is of use. http://jsfiddle.net/gnh2tuyj/2/