How to Disable a Anchor Tag in HTML?

By Hardik Savani | June 30, 2020 | Category : Javascript HTML jQuery


This tutorial is focused on how to disable anchor tag in html using javascript. you will learn how to disable a tag in html. we will help you to give example of how to disable a element in javascript. This article goes in detailed on how to disable a tag in jquery. follow bellow step for how to disable a anchor tag in jquery.

If you want to disable a tag then i will give you several examples of how to disable anchor tag using css, jquery and javascript.

so, let's see bellow some simple example that will help you how to disable a tag href in html.

Example 1:

<!DOCTYPE html>

<html>

<head>

<title>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</title>

<style type="text/css">

a.disabled {

pointer-events: none;

cursor: default;

opacity: .6;

}

</style>

</head>

<body>

<h1>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</h1>

<a href="https://www.itsolutionstuff.com" class="disabled">Go to ItSolutionStuff.com</a>

</body>

</html>

Example 2:

<!DOCTYPE html>

<html>

<head>

<title>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</title>

</head>

<body>

<h1>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</h1>

<a href="https://www.itsolutionstuff.com" onclick="return false;">Go to ItSolutionStuff.com</a>

</body>

</html>

Example 3:

<!DOCTYPE html>

<html>

<head>

<title>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</title>

</head>

<body>

<h1>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</h1>

<a href="javascript:function() { return false; }">Go to ItSolutionStuff.com</a>

</body>

</html>

Example 4:

<!DOCTYPE html>

<html>

<head>

<title>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</title>

<style type="text/css">

a[disabled="disabled"] {

pointer-events: none;

}

</style>

</head>

<body>

<h1>How to Disable a Anchor Tag in HTML? - ItSolutionStuff.com</h1>

<a href="https://www.itsolutionstuff.com" disabled="disabled">Go to ItSolutionStuff.com</a>

</body>

</html>

I hope it can help you...




Hardik Savani
My name is Hardik Savani. I'm a full-stack developer, entrepreneur and owner of Aatman Infotech. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.
Follow Me: Github Twitter
***Do you want me hire for your Project Work? Then Contact US.

We are Recommending you: