Wie kann ich die Bootstrap 3-Optionsfelder deaktivieren? Wenn ich mit dem BS3-Beispiel beginne und disabled="disabled" zu jedem Eingabeelement hinzufüge, gibt es keine Änderungen im Aussehen oder Verhalten:
Demo: JSFiddle .
Ich vermute, das liegt daran, dass das deaktivierte Attribut nur auf die jetzt unsichtbare Schaltfläche und nicht auf die anklickbare Textbeschriftung angewendet wird, aber ich sehe nichts in den BS3-Dokumenten dazu.
Wie von @giammin in den Kommentaren zur akzeptierten Antwort erwähnt, funktioniert die Einstellung 'deaktiviert' für die Eingabeelemente in 3.3.6 des Bootstrap nicht. (Aktuelle Version zum Zeitpunkt der Veröffentlichung dieser Antwort).
Ich hatte genau das gleiche Problem, und meine Lösung bestand darin, die CSS-Eigenschaft " Zeigerereignisse " zu verwenden. Dadurch wird sichergestellt, dass das Element und die untergeordneten Elemente niemals Ziel von Klickereignissen sind. Dies ist jedoch keine narrensichere Lösung - Benutzer können immer noch auf die Registerkarte zugreifen und Speicherplatz verwenden, um auf die ausgeblendeten Elemente in einem Desktop-Browser zu klicken.
%Vor%Wenn Sie dies auf Ihr Element .btn-group setzen, werden Sie
vollständig deaktivieren %Vor%Die Klasse ' .disabled ' ist dann optional - benutze sie zum Ausgrauen und 'cursor: not-allowed;' Eigenschaft.
Die Diskussion der Fixlösung ist an dieser Quelle: Ссылка
Fügen Sie für Optionsfeldgruppen die deaktivierte Klasse zu der Klasse hinzu, die Sie deaktivieren möchten. Stellen Sie sicher, dass Sie etwas wie diesen Code haben:
%Vor%Dadurch werden alle Ihre .disabled classized-Buttons in den Button-Gruppen ebenfalls deaktiviert. Dies funktioniert auch für Radio-Buttongruppen.
Wenn Sie im Bootstrap einen beliebigen Eingabetyp oder eine Schaltfläche deaktivieren möchten, müssen Sie nur die Klasse "Bootstrap .disabled" hinzufügen, dann wird Ihre Schaltfläche deaktiviert.
So
%Vor%Sie können das obige verwenden, um eine Eingabe [type = 'radio'] zu deaktivieren, die sich in einem Label (Bootstrap 3-Stil) befindet,
%Vor%Das obige um es wieder zu aktivieren,
%Vor%Sie können JQuery auch erweitern und eine Dummy-Deaktivierungsmethode (die Sie mit mehr Funktionalität aufrüsten könnten) wie folgt erstellen:
%Vor%Anwendungsbeispiel,
%Vor%Tags und Links javascript html twitter-bootstrap