How do you disable the contextmenu with DOM event handlers

[Bob90]

Hello,

So How do you disable the contextmenu with DOM event handlers?

I used to use

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

But what do I use with, for example

if(document.addEventListener)
			{
			document.addEventListener('contextmenu', returnFalse, false); 
			}
function returnFalse()
	{
	return false;	
	}

because it doesn't seem to work.

Thanks in advance


EDIT: And how do you enable the menu after you've disabled it?

[Twey]

if(document.addEventListener)
  document.addEventListener('contextmenu', function(e) { e.stopPropagation(); });
else if(document.attachEvent)
  document.attachEvent('oncontextmenu', function() { event.cancelBubble = true; });

[Bob90]

blummin' eck that was fast!

OK thats fantastic, but how do I re-enable the menu?

[Bob90]

I can't get it to work.

Firebug report 'not enough arguments' and the menu still displays

Do you have any idea as the rest of the web seems short on them.

[Bob90]

Just needed to add the argument false to the addeventlistener to stop bubbling.

if(document.addEventListener)
  document.addEventListener('contextmenu', function(e) { e.stopPropagation(); }, false);
else if(document.attachEvent)
  document.attachEvent('oncontextmenu', function() { event.cancelBubble = true; });

I've sorted the removeEventListener by creating my own function to be called and removing that.

function disableContextMenu(e)
	{
	if(!e)
		{
		event.cancelBubble = true;
		}
	else
		{
		if(e.stopPropagation)
			{
			e.stopPropagation();
			}
		else
			{
			return false; //redundant as not called	
			}
		}
		
	}

[mwinter]

Just needed to add the argument false to the addeventlistener to stop bubbling.

The third argument to the addEventListener and removeEventListener methods doesn't affect bubbling. It determines in which event phase the listener to be added or removed would be called. Passing true places the listener in the capturing phase, whilst passing false places the listener in the bubbling phase. In general, capturing should never be necessary.

To prevent bubbling, call the stopPropagation method, or assign true to the cancelBubble property.

To disable the default action for a particular event, call the preventDefault method, assign false to the returnValue property, or return false. The latter option is preferable to the second as they are equivalent, but the latter is compatible with more browsers.

Mike

[jscheuer1]

None of this stuff (it is essentially 'no right click' dressed up in drag) should be relied upon for anything. It will work in many cases and it will not work in may others. Even (if the issue is copying things) where it 'works' users will find another way to get the information they want copied.

Something like this is only appropriate where it enhances the web experience for the user. If it is for any kind of 'protection', get a condom.

[Bob90]

I feel I need to defend myself from the heresy that is 'Javascript Protection'.

I never intended it to be for protection, I hope that all regular coders would know javascript is a placebo. (In the sense that it may be called protection, but offers very little except self satisfaction for the newbie)

I am creating a radial menu for my site, which I want to code properly. At the moment it is a mess and I merely wanted a way to stop the menu appearing.

p.s. the condom joke is a winner.

[jscheuer1]

Sounds like an excellent use for this sort of code, except if you are trying to replace the context menu with your radial menu, that would be problematical as, many users would never get to see it, and others would see it overlaid by the default context menu for their browser.

[Bob90]

Thanks for your concern, but as you can gather from my second post I only want to temporarily disable it.

As for the people with problems, I am working around this at the moment.

If you have any suggestions I would love to hear them (About working around the contextmenu).