user2534466
user2534466

Reputation: 105

jQuery/HTML - Disable OnClick

as the title says I'm trying to disable OnClick for specific

<div id="test" style="display: block; opacity: 0.89;"></div>

this div is loaded from external script which is obfuscated so i cannot see the specific code.

What I have tried to remove this

$("#test").click(function(){ return false});
$("#test").unbind();
$("#test").removeAttr("onclick");
//Suggestions which do not work
$('#test').on('click', function(e) {e.preventDefault();return false;});
$("#test").click(function(event){
event.preventDefault();
});

None of the above work.

EDIT: Solved my problem using .unbind("click"); after the div was created.

Upvotes: 5

Views: 80386

Answers (8)

Sebastian Demian
Sebastian Demian

Reputation: 11

Try this:

To disable:

$("#test").css("pointerEvents","none");

To enable:

$("#test").css("pointerEvents","auto");

Upvotes: 1

Ishan Jain
Ishan Jain

Reputation: 8171

You can unbind click event into click event:

 $("#test").click(function(){
        $( "#test" ).unbind( "click");
        alert('Jquery/Javascript Event');
    });

Try JsFiddle

Upvotes: 0

Simple form, combination jquery with javascript.

// To disable:    

$('#test').each(function (){
    this.style.pointerEvents = 'none'; 
}); 

// To re-enable:
$('#test').each(function (){
    this.style.pointerEvents = 'auto'; 
}); 

So, you can change the selector for multiple tags

Upvotes: 8

nnnnnn
nnnnnn

Reputation: 150080

None of the options you've tried would work if you use them before the div has been added to the page. So be sure to put your code somewhere after the other script that creates the div.

If more than one element had that same id that would also be a problem.

Regarding the individual methods you've tried:

$("#test").click(function(){ return false});
$("#test").unbind();
$("#test").removeAttr("onclick");

The first line will add a new click handler to the element that prevents the default behaviour and stops the event propagating up, but it won't stop other event handlers bound to the element from running - especially if they run before your new handler, obviously.

The second line will remove event handlers that were attached with jQuery, but not handlers attached by other means.

The third line should work to remove an inline onclick attribute if it exists, but not handlers added with jQuery.

Assuming you still can't stop the click behaviour even after ensuring your code runs after the div is added to the page, you could try something like the following:

var $test = $("#test").removeAttr("onclick"),
    $contents = $test.contents().detach();
$test.replaceWith($test.clone(false).append($contents));

Demo: http://jsfiddle.net/A9tmu/3/

The idea there is to replace the element with a clone of itself, because the cloned version (when created with .clone(false)) will not retain event handlers. I'm temporarily detaching the divs contents before cloning so that any child elements will get to keep their event handlers.

Upvotes: 6

Henk Jansen
Henk Jansen

Reputation: 1142

Try this?

$('#test').unbind('click')

OR

   $( "#test" ).bind( "click", handler );
   $( "#test" ).unbind( "click", handler );

Try this

$( "#test" ).on("click", function () {
  });
$("#test").off("click");

Upvotes: 0

Smeegs
Smeegs

Reputation: 9224

You can add off("click");

Fiddle

$(function () {
    $("#test").click(function(){alert('test');});
    $("#test").off('click');

});

this code will demonstrate removing a previously added click event.

Upvotes: 14

arvic.rivera
arvic.rivera

Reputation: 673

try this:

$("#test").click(function(event) {
    event.preventDefault();
});

Upvotes: 0

Jura Khrapunov
Jura Khrapunov

Reputation: 1024

$('#test').on('click', function(e) {e.preventDefault();return false;});

Upvotes: 0

Related Questions