disable anchor tag using Jquery

Question

I have a image associated with the anchor tag, once the user clicks the image a popup loads. I want to disable this anchor tag.

The html code looks like:

<a href="#" class="openModalLink">
<img style="vertical-align: middle; border: none" width="9%" alt="" id="imgmap" class="zoom" /></a>

I have tried the below codes but doesn't seem to work

 $(".openModalLink").off("click");
 $(".openModalLink").attr("disabled", true);
 $(".openModalLink").attr("disabled", "disabled");

Thanks for the replies

:) This exact question is asked many times bruv: see duplicate: http://stackoverflow.com/questions/1164635/how-to-enable-or-disable-an-anchor-using-jquery — Tats_innit, Jun 12 '12 at 12:17

Dhiraj · Accepted Answer · 2012-06-22T04:29:35.440

You could do this

$('.openModalLink').click(function(event){
    event.preventDefault();
});

Also refer docs

EDIT:

To enable and disable anchor tag

function disabler(event) {
    event.preventDefault();
    return false;
}

$('#enable').click(function(){
    $('.openModalLink').unbind('click',disabler);
});
$('#disable').click(function(){
    $('.openModalLink').bind('click',disabler);
});

DEMO

EDIT 2:

As of jquery 1.7 .on() and .off() are preferred over bind and unbind to attach and remove event handlers on elements

$('#enable').click(function() {
    $('body').off('click', '.openModalLink', disabler);
});
$('#disable').click(function() {
    $('body').on('click', '.openModalLink', disabler);
});

disable anchor tag using Jquery

1 Answers1

Linked