CODEWITHSUNDEEP
javascript
Devilix
Devilix

Reputation: 323

How to re-enable RightClick only for specific tag/id

I'm using this code:

document.oncontextmenu = (function() {
   var counter = 0;
   return function() { 
       counter++;
       if (counter == 3) {
           $("<div id='r-click'></div>").appendTo("#container").html("<span>!!! Protected content !!!</span>").fadeIn(500).show().delay(4000).fadeOut(800, function() {
           counter = 0;
       });
       }
       return false;
   };
})();

Now, my issue is that I have a textarea with the HTML code for a banner, and I need context menu appear only on it. Is possible edit the code I'm using?

Upvotes: 0

Views: 94

Answers (2)

Devilix
Devilix

Reputation: 323

Here the final working example:

var counter = 0;
document.oncontextmenu = function(e) { if (e.target.id != "txt") {
    counter++;
    if (counter == 3) { 
    $("<div id='r-click'></div>").appendTo("#container").html("<span>!!! Protected content !!!</span>").fadeIn(500).show().delay(2000).fadeOut(800, function() { 
    counter = 0 });
    }
    return false; };
};

https://jsfiddle.net/t579asv5/5/

Upvotes: 0

Stanislav Terletskyi
Stanislav Terletskyi

Reputation: 2112

You need to use event object, which is passed to the oncontextmenu function.

Here the solution:

document.oncontextmenu = function(e) {
    var self = this;
    self.cnt = self.cnt || new(function() {
        this.counter = 0;
    });

    if (e.target.id !== "someBannerId") {
        return false;
    } else {
        self.cnt.counter++;
        if (self.cnt.counter === 3) {
            $('#r-click').remove();
            $("<div id='r-click'></div>").appendTo("#container").html("<span>!!! Protected content !!!</span>").fadeIn(500).show().delay(3000).fadeOut(800, function() {
                self.cnt.counter = 0;
            });
        }
    }
};

Update: the working example https://jsfiddle.net/3k9kL0xr/

Upvotes: 1

Related Questions