Temporarily disable button using jQuery

Question

I would like to disable a button element without removing the listener, for example I have ths following code:

<input id="in" />
<button id="sub">Submit</button>

$('#sub').click(function (e) {
    //Some actions
});


$($('#in').keyup(function (e) {
    if (new Date($(this).val()) == 'Invalid Date') {
        $(this).addClass('invalid');
        $('#sub').addClass('disabled');
    }
    else {
        $(this).removeClass('invalid');
        $('#sub').removeClass('disabled');

    }
});

I would like to unbind the button click listener, but if I'll use off() or unbind() I will have to 're-bind' it in the else clause.

Is there any better way of doing this?

You don't want to unbind actions right? So you can use the disabled property like $("#sub").prop("disabled",true); — Irvin Dominin
– Irvin Dominin, Commented Aug 12, 2013 at 11:47
is there a reason why you dont want to attach the event in the else? — reyaner
– reyaner, Commented Aug 12, 2013 at 11:50

CodingIntrigue · Accepted Answer · 2013-08-12 11:49:03Z

3

How about disabling the button instead of adding a class?

HTML:

<button>Disable Me</button>

JS

$(function() {
    $("button").click(function() {
        alert("click!");
       $(this).prop("disabled", true); 
    });
});

CSS

button[disabled] {
 color: red;
}

Here is a jsFiddle to demonstrate.

answered Aug 12, 2013 at 11:49

CodingIntrigue

79k32 gold badges176 silver badges178 bronze badges

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

Comments

schnill · Accepted Answer · 2013-08-12 11:49:46Z

0

use $('#sub').prop('disabled');

answered Aug 12, 2013 at 11:49

schnill

9551 gold badge5 silver badges13 bronze badges

Collectives™ on Stack Overflow

Temporarily disable button using jQuery

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related