CODEWITHSUNDEEP
jquery
user790843
user790843

Reputation: 133

Deactivate/activate link with jQuery?

I'm looking for a simple solution to deactivate/activte button links. I could use addClass/removeClass to change the color to gray when deactivated, but there is still possible to click on the link. Is there a way to handle this?

Upvotes: 0

Views: 4372

Answers (6)

zk_mars
zk_mars

Reputation: 1339

Although this is an old question, I just want to update the solution. You can easily disable anything in JQuery Mobile, even custom DIVs or classes by simply adding ui-disabled class:

$('#customdiv').addClass('ui-disabled');

Upvotes: 0

volkovs
volkovs

Reputation: 1183

For links it is enough to remove href attribute like:

            if (<something>) {
                aHrefLink.attr('href', '/products?productId=' + productId);
                aHrefLink.attr('title', '');
            } else {
                aHrefLink.removeAttr('href');
                aHrefLink.attr('title', 'Please select the product first');
            }

Upvotes: 0

John Strickler
John Strickler

Reputation: 25421

In jQuery 1.4.3 you can now pass in 'false' in place of an event handler. This will bind an event handler that's equivalent to: function(){ return false; }. This function can be removed at a later time by calling: .unbind( eventName, false ).

    //Same as e.preventDefault() and e.stopPropagation();
    $('a').click(false);

    //Or if you don't want to stopPropagation by default()...
    $('a').click(function(e) {
        e.preventDefault();
    });

Upvotes: 0

Shef
Shef

Reputation: 45589

You can try this:

$('#linkId')
    .addClass('deactivated')
    .click(function(e){
        if($(this).hasClass('deactivated')){
            e.preventDefault();
        }
    });

Here is a demo of link click deactivated

Please, post your code so we can adjust to your situation.

Upvotes: 2

Adam Terlson
Adam Terlson

Reputation: 12730

Similar to James' answer (which is totally appropriate), but a slightly different approach:

$('a.disabled').click(function(e) {
    e.preventDefault();
    return false;
});

Now just use this:

<a href="foo" class="disabled">Disabled Link</a>

Upvotes: 0

James Allardice
James Allardice

Reputation: 165971

You can prevent the default behaviour of the link like this:

$('#linkID').click(function(e) { e.preventDefault(); });

If you mean "button" rather than "link" (as you say "button links" I'm not sure which you mean), you can simply disable the button:

$('#buttonID').attr('disabled', true);

Upvotes: 2

Related Questions