45 Stimmen

Checkbox mit Javascript teilweise auswählen

Gibt es eine Möglichkeit, mit Javascript und HTML(5) ein Kontrollkästchen teilweise auszuwählen, wie die Kontrollkästchen in einem Programm-Installationsmenü, wenn Sie nur einige der Unteroptionen auswählen?

81voto

kassens Punkte 4347

HTML5 definiert el indeterminate boolesche Eigenschaft.

Ich habe es nur mit den neuesten Versionen von Safari, Chrome und Firefox getestet. Sie alle unterstützen den unbestimmten Zustand.

http://jsfiddle.net/5tpXc/

Bearbeiten: Beachten Sie, dass dies bei älteren Browsern nicht funktioniert und vielleicht nicht mit den aktuellen Versionen des IE. Sie müssten sich auf Hacks verlassen, wie in anderen Antworten hier beschrieben, wenn Sie alle Browser unterstützen wollen.

4voto

BumbleB2na Punkte 10622

Nö. Sie müssten eine benutzerdefinierte Kontrollkästchengrafik erstellen und sie fälschen.

Bearbeiten: Siehe @Kassen's Antwort für eine Möglichkeit, teilweise angekreuzte Felder in HTML5-kompatiblen Browsern zu haben.

4voto

David Punkte 189311

HTML-Kontrollkästchen (d.h., input Elemente des Typs checkbox ) haben keinen dritten Zustand (teilweise angekreuzt). Also nein, es gibt keine direkte Möglichkeit, dies zu tun.

Sie müssen wahrscheinlich ein benutzerdefiniertes Bild erstellen, das wie ein Kontrollkästchen aussieht, und es an seine verschiedenen Ereignisse (z. B. Klick) binden, um seinen aktuellen "Zustand" in einer hidden Formularfeld über JavaScript. Bei diesem Ansatz kann es jedoch zu einer Reihe von Problemen kommen.

Zum Beispiel kann es sein, dass die Tastaturnavigation des Formulars für dieses Element nicht möglich ist. (Kann man mit der Tabulatortaste zu einem Bild navigieren und ihm Tastaturereignisse senden? Ich bin mir nicht sicher.)

Außerdem können Sie versuchen, benutzerdefinierte Attribute eines Kontrollkastenelements über JavaScript zu manipulieren, um einen dritten Status zu speichern. Aber das Rendering des Elements selbst hat keinen visuellen Indikator für so etwas. Sie könnten wahrscheinlich seinen Stil (Farbe, Hintergrundfarbe, Rahmenfarbe usw.) manipulieren, um zu versuchen, das visuelle Verhalten zu imitieren. Aber Sie werden möglicherweise nicht in der Lage sein, den genauen visuellen Stil zu erreichen, den Sie als Referenz verwenden.

Es ist sicherlich eine interessante Perspektive, und ich bin fasziniert genug, dass ich vielleicht versuchen, so etwas in naher Zukunft zu implementieren. Aber mit einem nativen Checkbox-Element ist das nicht möglich. Es hat nur zwei Zustände.

Bearbeiten: Siehe @kassens' Antwort um dies in HTML5 zu tun. Wenn Sie aus irgendeinem Grund auf frühere HTML-Versionen beschränkt sind, müssen Sie einen Hack verwenden, wie hier beschrieben. Aber wenn Sie sich darauf verlassen können, dass die Benutzer HTML5 unterstützen, dann sieht es so aus, als ob die native Unterstützung vorhanden ist.

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X