jQuery Disable Link onClick Examples – 1 line code

Did you ever want to disable link onClick using jQuery but always wondered how to do it? In this article, I am going to share with you a very easy way to disable a hyperlink using jQuery. That means that whenever you click on a hyperlink, it will no longer navigate to the linked page and you will remain on the page that you are currently on. The actual code is just 1 line, so it’s super easy to follow along. Read on to find out more.

Examples on using jQuery to Disable Link onClick

Let’s assume that we have a hyperlink with class “.my_link” and we would like to disable this hyperlink so that when it is clicked, the page does not navigate to the linked page. Here is how you can do it very easily:

$(".my_link").click(function(e) {

//You can do some other stuff, like show alert
alert('You clicked me!');

//the following line of code disables the hyperlink
e.preventDefault();
});

So as shown in the above code, for events such as onClick, etc. you can easily prevent the default behavior by calling event.preventDefault() in the event handler of the element (in this case, the hyperlink). So now you know using jQuery disable link onClick can be achieved with just 1 line of code.

Simple, isn’t it?

Do you know of any other ways to disable a hyperlink onClick using jQuery? Feel free to suggest by commenting below.