Der beste Weg, um die Schaltfläche in Twitter's Bootstrap zu deaktivieren

Ich bin verwirrt, wenn es darum geht, ein <button>, <input> oder ein <a>-Element mit den Klassen:.btnoder.btn-primary`, mit JavaScript/jQuery zu deaktivieren.

Ich habe das folgende Snippet dazu verwendet:

$('button').addClass('btn-disabled');
$('button').attr('disabled', 'disabled');
$('button').prop('disabled', true);

Also, wenn ich nur die $('button').addClass('btn-disabled'); zu meinem Element, wird es als deaktiviert erscheinen, visuell, aber die Funktionalität wird die gleiche bleiben und es wird trotzdem klickbar sein, so dass es der Grund, warum ich die attr und prop Einstellungen zu dem Element hinzugefügt.

Hat jemand das gleiche Problem schon einmal erlebt? Ist dies der richtige Weg, dies zu tun - während mit Twitter & #39; s Bootstrap?

Lösung

Sie brauchen nur den Teil $('button').prop('disabled', true);, die Schaltfläche wird automatisch die Klasse disabled annehmen.

Kommentare (7)

Der einfachste Weg, dies zu tun, ist die Verwendung des Attributs "disabled", wie Sie es in Ihrer ursprünglichen Frage getan hatten:

Inhalt der Schaltfläche

Im Moment hat Twitter Bootstrap keine Methode, um die Funktionalität eines Buttons zu deaktivieren, ohne das Attribut disabled zu verwenden.

Nichtsdestotrotz wäre dies eine hervorragende Funktion, die sie in ihre Javascript-Bibliothek implementieren könnten.

Kommentare (3)

Was auch immer Attribut der Schaltfläche / Anker / Link hinzugefügt wird, um es zu deaktivieren, Bootstrap ist nur das Hinzufügen von Stil zu ihm und Benutzer wird immer noch in der Lage, es zu klicken, während es noch onclick-Ereignis ist. Also meine einfache Lösung ist zu überprüfen, ob es deaktiviert ist und entfernen/hinzufügen onclick-Ereignis:

if (!('#button').hasAttr('disabled'))
 $('#button').attr('onclick', 'someFunction();');
else
 $('#button').removeattr('onclick');
Kommentare (3)