Allowing right-click on selected class in Javascript

Question

I have a javascript that prevents right click on an HTML page:

document.addEventListener("contextmenu", function(e){
    e.preventDefault();
}, false);

I have a <input> tag on that same page with the name "Link" that I want the right click to happen on.

How can I achieve that?

Answer 1

You can check and test e.target of the event:

document.addEventListener("contextmenu", function(e){
    if (e.target.tagName.toLowerCase() === 'input' && e.target.name === 'Link') {
      return; //pass
    }
    e.preventDefault(); // prevent others
}, false);

Answer 2

Put an if statement inside your event listener:

document.addEventListener("contextmenu", function(e){
    if (e.target.name !== "Link") {
        e.preventDefault();
    }    
}, false);

So it basically says: when the target element does not have a name of Link prevent the right click.

Answer 3

 <div> This is the Phone and NO ONE SHOULD RIGHT CLICK THIS! >:) </br> <img oncontextmenu="return false;" class="tlClogo" src="http://i.imgur.com/0atiS5C.jpg" style="height: 120px; width:120px;"> </div> </br></br></br></br> And this is the Keyboard, ofcourse yo can right click this :)</br> <img src="http://i.imgur.com/xkrKz1X.jpg" style="height: 120px; width:120px;"> 

Working Fiddle Example