jquery - disable click

Question

I just want to disable the ability for a user to click on an element for some condition. Here is some of the code I am working with:

$('#navigation a').bind('click',function(e) {
 
    var $this   = $(this);
    var prev    = current;
    
    current = $this.parent().index() + 1; // store the position in current
    
    if (current == 1){
    $("#navigation a:eq(1)").unbind("click"); // i want to disable the ability to click this element if current is 1
    }
    if (current >= 2){
    $("#navigation a:eq(1)").bind("click"); // this is wrong, but I want to rebind the click if current is greater than 1.  
    }

}

$('selector').prop("disabled", true);

vishalknishad
– vishalknishad

2019-02-22 04:44:46 +00:00
Commented Feb 22, 2019 at 4:44 — vishalknishad
– vishalknishad, Commented Feb 22, 2019 at 4:44

zzzzBov · Accepted Answer · 2012-08-02 19:07:00Z

106

If you're using jQuery versions 1.4.3+:

$('selector').click(false);

If not:

$('selector').click(function(){return false;});

edited Aug 2, 2012 at 19:07

answered Jan 4, 2011 at 1:38

zzzzBov

180k57 gold badges328 silver badges375 bronze badges

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

1 Comment

Gaʀʀʏ Over a year ago

Is there a way to toggle disabling the click function instead of redefining it?

ehudokai · Accepted Answer · 2011-01-04 06:45:04Z

28

assuming your using click events, just unbind that one.

example

if (current = 1){ 
    $('li:eq(2)').unbind("click");
}

EDIT: Are you currently binding a click event to your list somewhere? Based on your comment above, I'm wondering if this is really what you're doing? How are you enabling the click? Is it just an anchor(<a> tag) ? A little more explicit information will help us answer your question.

UPDATE:

Did some playing around with the :eq() operator. http://jsfiddle.net/ehudokai/VRGfS/5/

As I should have expected it is a 0 based index operator. So if you want to turn of the second element in your selection, where your selection is

$("#navigation a")

you would simply add :eq(1) (the second index) and then .unbind("click") So:

if(current == 1){
    $("#navigation a:eq(1)").unbind("click");
}

Ought to do the trick.

Hope this helps!

edited Jan 4, 2011 at 6:45

answered Jan 4, 2011 at 1:39

ehudokai

1,92612 silver badges9 bronze badges

5 Comments

scifirocket Over a year ago

im binding the click in a manner like this: $('#navigation a').bind('click',function(e){ so i am using the <a> tag.

ehudokai Over a year ago

Oh, ok, that helps a lot. It's really just as simple as adding the a onto the selector I think. So: $('#navigation li:eq(2) a').unbind('click');

ehudokai Over a year ago

@scifirocket: Of course I was wrong, but if you see my update above, I tested this answer :).

scifirocket Over a year ago

so now that I have unbinded the click if current = 1, how can I rebind the click otherwise. I know it's not as simple as $("#navigation a:eq(1)").bind("click");

ehudokai Over a year ago

to rebind do $("#navigation a:eq(1)").bind("click", function(){//yourcode});

Ben · Accepted Answer · 2011-01-04 02:20:45Z

10

Raw Javascript can accomplish the same thing pretty quickly also:

document.getElementById("myElement").onclick = function() { return false; }

edited Jan 4, 2011 at 2:20

answered Jan 4, 2011 at 1:44

Ben

57.6k50 gold badges187 silver badges229 bronze badges

2 Comments

David Tang Over a year ago

I assumed that it was a typo, so I added the "#" to the jQuery selector ;)

David Tang Over a year ago

Although... the .onclick won't work on a jQuery object either. You need [0] or .get(0).

Joko Wandiro · Accepted Answer · 2011-01-04 01:44:22Z

6

You can use unbind method to remove handler that has been attached...

if (current = 1){ 
   $('li:eq(2)').unbind('click');
}

You can check what can unbind do ? Unbind manual

answered Jan 4, 2011 at 1:44

Joko Wandiro

1,9872 gold badges18 silver badges29 bronze badges

2 Comments

scifirocket Over a year ago

actually, I probably needed to use something like this" $('#navigation li:eq(2)').unbind('click'); but that isn't working either. im trying to disable the click event to a particular element of a list.

ehudokai Over a year ago

@scifirocket: are you binding a click event somewhere in your code? Or are you just using an anchor that you want to disable?

smonff · Accepted Answer · 2018-12-20 16:00:46Z

2

Use off() method after click event is triggered to disable element for the further click.

$('#clickElement').off('click');

edited Dec 20, 2018 at 16:00

smonff

3,5084 gold badges40 silver badges49 bronze badges

answered Nov 26, 2018 at 9:17

Sajitha Rathnayake

1,7263 gold badges27 silver badges52 bronze badges

Comments

raquelhortab · Accepted Answer · 2025-03-04 10:26:29Z

1

A really simple solution is to disable pointer-events via css:

$(selector).css('pointer-events', 'none')

answered Mar 4 at 10:26

raquelhortab

5465 silver badges15 bronze badges

Comments

Dharman · Accepted Answer · 2020-09-22 14:24:21Z

0

I used .prop('disabled', true) and it worked like a charm, no redefining, simple.

Had to time it out by 125ms as it interfered with the prop from Bootstrap Dropdown.

edited Sep 22, 2020 at 14:24

Dharman♦

33.9k27 gold badges106 silver badges157 bronze badges

answered Sep 22, 2020 at 14:18

Justin

1

Comments

Giacomo1968 · Accepted Answer · 2025-04-03 22:55:09Z

0

$('#navigation a').bind('click',function(e){

    var $this   = $(this);
    var prev    = current;

    current = $this.parent().index() + 1; //

    if (current == 1){
        $("#navigation a:eq(1)").unbind("click"); // 
    }
    if (current >= 2){
        $("#navigation a:eq(1)").bind("click"); // 
    }
}

edited Apr 3 at 22:55

Giacomo1968

25.3k11 gold badges78 silver badges106 bronze badges

answered Apr 16, 2020 at 8:20

E Work You

11 bronze badge

Collectives™ on Stack Overflow

jquery - disable click

8 Answers 8

1 Comment

5 Comments

2 Comments

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

1 Comment

5 Comments

2 Comments

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related