1

How to disable this below context menu in jquery when text box is disabled. my right click disabled functionality working fine in all browsers except firefox.

Note: When text box is enabled the right click disabled functionality is working fine in all browsers.Please help here.

I tried the below code in my body tag. but it won't work in firefox

oncontextmenu="return false;"

enter image description here

Improve this question
15
  • 1
    Can you show us code ? , how are you trying to dis-able it ? Commented Jan 23, 2015 at 7:39
  • In my body tag i added oncontextmenu="return false;" Commented Jan 23, 2015 at 7:41
  • 1
    add that to the question or you are likely to get a number of downvotes for no code. Also suggest you provide a demo that replicates the problem Commented Jan 23, 2015 at 7:42
  • 1
    @Sankar Update your question with your code , untill that it is not completely possible to help Commented Jan 23, 2015 at 7:42
  • @sankar If you'll take a careful look at the context menu in the post, you can see, it's the common menu for the page, not the menu for inputs, which has functions like Copy and Paste. Why the common menu should be prevented? Commented Feb 13, 2015 at 13:50

3 Answers 3

Reset to default
6
+25

This code works in firefox:

document.oncontextmenu=disableclick; function disableclick(event) { event.preventDefault(); alert("Context Menu Disabled"); return false; }

http://jsfiddle.net/zumk5cta/1/

Update

contextmenu event won't work for disabled elements in firefox, it's a firefox behavior as explained well here

As a solution to your problem, I picked up the idea given by @Endy E in his response here:

html

<span class="inputWrapper"> <input type="text" disabled /> <div class="mouseEventTarget"></div> </span>

css

.inputWrapper{ position:relative; } .mouseEventTarget{ position:absolute; left:0; right:0; top:0; bottom:0; cursor: text }

javascript

$(document).on('contextmenu', 'input:disabled + .mouseEventTarget',function(e){ return false; });

fiddle

Improve this answer
Sign up to request clarification or add additional context in comments.

6 Comments

The dup is a nice catch, and nailed also what I've been trying to explain to OP.
@Teemu Yes, so you think that it should be marked as duplicate?
Actually I wouldn't. OP has something different, since the common menu pops up instead of the input menu. I'd wait until OP they post some code to work with (I hope they will), and if then it will appear, that there's just a wrong picture in the post, I'd vote for a dup.
Yes, this question should be marked as a duplicate. Doesn't matter what kind of event is being captured if the answer is going to be the same: Firefox doesn't propagate events originating from a disabled form field of any kind.
what if the user textbox is in center with someother elements positioned before or after them
|
1

HTML

<div> In order to prevent default behavior of Firefox browser <br /> you need to go for a kind of hack/trick here is the trick take the <div class="inputWrapper"> &nbsp; <input class="disabled" disabled type="text" /> </div> </div>

CSS

.inputWrapper{display:inline-block;width:208px;z-index:9} .disabled { z-index: -1; position: absolute; width:200px }

JQuery

$(document).on("contextmenu", ".inputWrapper", function(e){ return false; });

Demo JSFIDDLE

Explain

In order to prevent default behavior of Firefox browser you need to go for a kind of hack/trick here is the trick, bring the div above the input box using z-index and firing the event of parent div i.e inputWrapper

Note: z-index of parent div should always greater then the input element

Improve this answer

Comments

-1

You can do so with Javascript and/or an HTML attribute (which is really a Javascript event handler anyway) as described here:

Live Demo

<script language="javascript"> document.onmousedown=disableclick; status="Right Click Disabled"; Function disableclick(event) { if(event.button==2) { alert(status); return false; } } </script>

and

<body oncontextmenu="return false"> ... </body>
Improve this answer

2 Comments

This doesn't work when i right click on disabled button.This issue happens only in firefox.
Sorry i can't understand properly what is you required ... if you like this medialize.github.io/jQuery-contextMenu/demo/disabled-menu.html

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.