I would like to disable anchor link (<a>)in my HTML, making it non-clickable?
It doesn't have any URL, but It is clickable and redirect to same to the page, here is code.
<a href="{{URL}}" class="user-notification-item user-notification-item-unread">
<span class="details">
<i class="fa fa-check"></i> Test
</span>
<div>
<span class="notification-time" title="2018-01-12 14:26:08">4 minutes ago</span>
<span>
-
<span data-notification-id="d2f07dcc-1d51-49e0-9d6f-109cd4bdd405" class="set-as-read-text set-notification-as-read">set as read</span>
</span>
</div>
</a>I would like to disable it using CSS or with some jquery/javascript, so how can i do it?
Answered by:- manish
You can disable anchor link easily using these ways:
1. Using HTML, by making href="#"
<a href="#">Some text here</a>2. Using HTML, by making href="javascript:void(0)"
<a href="javascript:void(0)">Some text here</a>3. Using jQuery
$(function () {
//Get all <a> who has class AchorClass
$('a.AchorClass').on("click", function (e) {
//make it non-clickable using this code
e.preventDefault();
});
});4. Using CSS
a.AchorClass{
pointer-events: none;
}Subscribe to our weekly Newsletter & Keep getting latest article/questions in your inbox weekly
Buy us a coffee
Become a Patron