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 clic开发者_JS百科k on the link. Is there a way to handle this?

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);

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.

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>

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();
    });

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');
            }

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');