How to disable HTML links

Question

I have a link button inside a which I have to disable. This works on IE but not working in Firefox and Chrome. Structure is - Link inside a <

Answer 1

Bootstrap 4.1 provides a class named disabled and aria-disabled="true" attribute.

example"

    Primary link

More is on getbootstrap.com

So if you want to make it dynamically, and you don't want to care if it is button or ancor than in JS script you need something like that

   let $btn=$('.myClass');
   $btn.attr('disabled', true);
   if ($btn[0].tagName == 'A'){
        $btn.off();
        $btn.addClass('disabled');
        $btn.attr('aria-disabled', true);
   }

But be carefull

The solution only works on links with classes btn btn-link.

Sometimes bootstrap recommends using card-link class, in this case solution will not work.