js-Methode zur Verwendung von DOM zum Festlegen von Optionsfeldern, Kontrollkästchen und Dropdown-Menüs_Javascript-Fähigkeiten

Das Beispiel in diesem Artikel beschreibt, wie js DOM verwendet, um Optionsfelder, Kontrollkästchen und Dropdown-Menüs festzulegen. Teilen Sie es als Referenz mit allen. Die spezifische Implementierungsmethode lautet wie folgt:

1. Optionsfelder festlegen

Das Optionsfeld im Formular lautet Es handelt sich um eine Reihe von Objekten, die der Benutzer auswählen kann, es kann jedoch jeweils nur eines ausgewählt werden. Jedes hat ein aktiviertes Attribut. Wenn eine Auswahl wahr ist, werden die anderen falsch.

Veröffentlichen Sie zuerst ein Beispiel:

Code kopieren Der Code lautet wie folgt:

Kameramarke:

Canon

Nikon

Sony

Olympus

Samsung

Pentax

others

Das Optionsfeld im Formular lautet Es handelt sich um eine Reihe von Objekten, die der Benutzer auswählen kann, es kann jedoch jeweils nur eines ausgewählt werden. Jedes hat ein aktiviertes Attribut. Wenn eine Auswahl wahr ist, werden die anderen falsch.
Wie aus dem obigen Code ersichtlich ist, sind die ID und der Name unterschiedlich. Ihre Namen in einer Gruppe von Optionsfeldern sind gleich und es ist nur eines ausgewählt. Die ID ist an gebunden.

Im Code: Der Code zum Überprüfen des ausgewählten Objekts lautet (wenn der überprüfte Wert eines bestimmten Elements wahr ist, endet der Durchlauf)

Code kopieren Der Code lautet wie folgt:

var oForm = document.forms["uForm1"];
var aChoices = oForm.camera;
for (i = 0; i < aChoices.length; i ) //Durchlaufe die gesamte Single-Choice-Liste
If (aChoices[i].checked) //Beenden, wenn das ausgewählte Element gefunden wird
Pause;
Alert("Die Kameramarke ist: " aChoices[i].value);

2. Mehrfachauswahlfeld festlegen

Im Gegensatz zu Optionsfeldern können Kontrollkästchen mehrere Optionen zur gleichzeitigen Verarbeitung auswählen. Das Kontrollkästchen vor jeder E-Mail im Postfach ist eine typische Verwendung.

Code kopieren Der Code lautet wie folgt:

Was du gerne machst:

Ball spielen

fernsehen

Internet

Lesen

Reisen

Musik

others

Das Kontrollkästchenprinzip wird durch die Verwendung des booleschen Werts des aktivierten Attributs bestimmt. Parameter können in der Form 0 und 1 übergeben werden, um alle und nicht alle auszuwählen.

3. Dropdown-Menü

Dropdown-Menü ist ein häufig verwendetes Formularelement. Wenn das Dropdown-Menü für die Einzelauswahl vorgesehen ist, hat es dieselbe Funktion wie die Optionsschaltfläche . Wenn das Dropdown-Menü für die Mehrfachauswahl vorgesehen ist, gilt bei multiple="multiple", Seine Funktion entspricht der eines Kontrollkästchens, es nimmt jedoch weniger Fläche ein, viel kleiner als ein Kontrollkästchen.

Gemeinsame Attribute von Dropdown-Menüs:

darstellt

Eigenschaften	Beschreibung
Länge	Gibt die Anzahl der Optionen an
ausgewählt	Boolescher Wert, der angibt, ob ausgewählt ist
SelectedIndex	Die Seriennummer der ausgewählten Option, -1, wenn keine Option ausgewählt ist, gibt bei Dropdown-Menüs mit Mehrfachauswahl die erste ausgewählte Option zurück Seriennummer, beginnend bei 0
Text	Optionstext
Wert	Optionswert
Typ	Die Art des Dropdown-Menüs: Einzelauswahl gibt „Eins auswählen“ zurück, Mehrfachauswahl gibt „Mehrfachauswahl“ zurück
Optionen	Rufen Sie das Optionsarray ab, zum Beispiel: oSelectBox.options[2], das das dritte Element des Dropdown-Menüs oSelectBox

① Holen Sie sich den Radioauswahlwert aus dem Dropdown-Menü

Code kopieren Der Code lautet wie folgt:

Sternbild:

Aries Stier Gemini Krebs Löwe Jungfrau Libra Scorpio Schütze Capricorn Wasserflasche Fische

② Wenn das Dropdown-Menü eine Mehrfachauswahl umfasst, lautet der Wert

Code kopieren Der Code lautet wie folgt:

Sternbild:

Widder Stier Gemini Krebs Löwe Jungfrau Libra Scorpio Schütze Capricorn Wasserflasche Fische

③ Universeller Wert (Dropdown-Einzelauswahl und Mehrfachauswahl)

Code kopieren Der Code lautet wie folgt:

Konstellation:

Aries Stier Gemini Krebs Löwe Jungfrau Libra Scorpio Schütze Capricorn Wasserflasche Fische

Widder Stier Gemini Krebs Löwe Jungfrau Libra Scorpio Schütze Capricorn Wasserflasche Fische

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.