Ich bin sicher, was ich versuche, ist ziemlich einfach, aber ich brauche etwas Hilfe.
Ich habe drei Optionsfelder;
Ich möchte die Klasse (Bootstrap v3) der Schaltflächen ändern, wenn sie angeklickt werden. Sie alle haben eine Standardklasse von btn-default
. Aber wenn ich geklickt habe, möchte ich dann die folgenden Klassen haben:
btn-success
) btn-warning
) btn-danger
) Es sollte immer nur eine ausgewählt sein, und nur eine sollte gleichzeitig gefärbt sein.
Mein Code ist soweit unten, ich glaube, ich bin fast da. Wenn jemand einen Ratschlag anbieten könnte, wäre das großartig.
Hier ist ein Link zu meinem Beitrag .
Der Code, den Sie haben, ändert die Klassen nicht, weil Sie auf die falschen Elemente abzielen. Bei den anderen Antworten wurde jedoch nicht berücksichtigt, dass nur jeweils einer farbig sein soll. Fügen Sie einfach die Klassen zum Entfernen hinzu und fügen Sie die Standardklassen zu den Änderungen hinzu. Versuchen Sie Folgendes:
%Vor%Entferne alle angewendeten Klassen, sobald dies erledigt ist, finde heraus, auf welche Schaltfläche geklickt wurde, und wende diese Option CSS an. Im Hinblick darauf, warum sich das CSS nicht änderte, zielte man nicht auf die Labels, in denen das btn- "Bootstrap-Button-Styling hier einfügen" angewendet wurde, durch Aufrufen von parent () ging man auf die Ebene, die das CSS kontrollierte.
Generalisieren Sie außerdem die Entfernung:
%Vor% Sie könnten Custom Data Attribute
wie folgt verwenden
Das Problem ist, dass Sie Ihren Change Event-Handler an die input
binden, aber die <label>
sind diejenigen, die mit btn-default
formatiert sind.
Ändern Sie die Referenzen auf $(this)
auf $(this).parent()
und es wird wie vorgesehen funktionieren.
Zweitens wählt Ihr Selektor das untergeordnete Element aus, aber Sie müssen die Klasse des übergeordneten Elements ändern. Du musst also parent () hier verwenden
Um nur eines zu aktivieren, müssen Sie die Klasse von einer anderen Schaltfläche entfernen. Das ist der Code
%Vor%
Tags und Links javascript html jquery css twitter-bootstrap