bootstrap : unable/disable link bootstrap using javascript

Question

this is an active link

<a href="#" class="btn btn-large">Link</a>

how to disable this link using javascript, so the code would be like this?

<a href="#" class="btn btn-large disabled">Link</a>

to prevent the savechanges button clicked when data values not yet edited — ocit, Jul 12 '13 at 08:14
Might be a duplicate of the question [What is the easiest way to disable/enable buttons and links (jQuery + Bootstrap)](http://stackoverflow.com/q/16777003/4043409), asked two months before this. — Gideon, Jul 29 '15 at 02:59

score 18 · Accepted Answer · answered Jul 12 '13 at 08:05

18

HTML

<a href="#" id="myLink" class="btn btn-large">Link</a>

Pure JS

var d = document.getElementById("myLink");
d.className = d.className + " disabled";

jQuery

$('#myLink').addClass('disabled');

answered Jul 12 '13 at 08:05

Mihai Matei

7

Notice that with this the button will just appear disabled but will still be clickable. To also make it unclickable, you can add this (jQuery): `$('#myLink').on('click', function(e) { e.preventDefault(); });` – Pedro Moreira Nov 25 '14 at 11:57
6

In modern browsers and modern bootstrap, this code will not necessary because the `.btn:disabled` has `pointer-events:none` so it will not be clickable. – Mosh Feu Mar 31 '16 at 12:45

score -2 · Answer 2 · edited Sep 18 '17 at 20:17

-2

Use the attribute disabled in a class, like class="btn btn-danger disabled"

For example:

<a href="exampleLink.php?id=3&option=1" class="btn btn-danger disabled" role="button">Cancelar</a>

edited Sep 18 '17 at 20:17

blurfus

answered Sep 18 '17 at 19:27

John Doe

2 Answers2