Überprüfen Sie ein Optionsfeld mit JavaScript

In einigen Fällen müssen Programmierer das Optionsfeld überprüfen/markieren. Wählen Sie beispielsweise die entsprechende Optionsschaltfläche automatisch basierend auf einer Benutzeraktion oder einem bestimmten Szenario aus. Dafür verwenden Sie das JavaScript “überprüft”Eigenschaft des Optionsfelds zum Setzen“WAHR”. Das Überprüfen eines Optionsfelds mit JavaScript kann die Verwendung der Website einfacher und effizienter machen.

In diesem Blog wird die Möglichkeit zum Überprüfen/Markieren eines HTML -Optionsschaltwerks mit JavaScript demonstriert/markieren.

So überprüfen Sie ein Optionsfeld mit JavaScript?

Verwenden Sie die “, um ein Optionsfeld mit JavaScript zu überprüfenüberprüftEigenschaft/Attribut eines HTML -Optionsfelds. Es handelt sich um ein Boolean -Wert -Attribut, das verwendet wird, um den geprüften Status eines Optionsfelds zurückzugeben.

Syntax
Um die Werte festzulegen, verwenden Sie die folgende Syntax, in der wir den Wert des Attributs auf “festlegen“WAHR" oder "FALSCH”.

RadioObject.geprüft = true | false

Beispiel 1: Überprüfen Sie ein Optionsfeld, indem Sie auf die Schaltfläche klicken
Erstellen Sie ein Optionsfeld:

Zustimmen

Erstellen Sie eine Schaltfläche, mit der das Optionsfeld überprüft wird, indem Sie darauf klicken:

Wählen Sie das Optionsfeld

Eine Funktion definieren “checktheradio ()”Das wird auf der Schaltfläche Klick ausgelöst. Holen Sie sich die Referenz des Optionsfelds und setzen Sie die “überprüft”Eigentum zu“WAHR”:

Funktion checktheradio ()
dokumentieren.GetElementById ("Vereinbar").geprüft = wahr;

Hier können Sie sehen, dass das Optionsfeld erfolgreich überprüft wurde, indem Sie auf die “klicken“Wählen Sie das Optionsfeld”:

Sie können auch die „verwenden“überprüft”Eigenschaft, um den Wert des ausgewählten Optionsfelds zu erhalten.

Beispiel 2: Erhalten Sie den Wert der ausgewählten Optionsschaltfläche
Erstellen Sie in einer HTML -Datei eine Gruppe von Optionsfeldern, die die Wochentage anzeigen:

Montag

Dienstag

Mittwoch

Donnerstag

Freitag

Samstag

Sonntag

Erstellen Sie eine Schaltfläche, indem Sie eine anhängen “Onclick ()"Ereignis, das die Funktion aufruft"überprüfen()”:

Überprüfen Sie die ausgewählte Optionsschaltfläche

Ein ... kreieren

Tag, um den Wert des ausgewählten Optionsknopfs zu erhalten:

In der JavaScript -Datei erhalten Sie zunächst die Referenzen der Optionsfelder, der Schaltfläche und a

Schild "GetElementById ()" Und "QuerySelectorAll ()Methoden:

const CheckBtn = Dokument.GetElementById ('btn');
const radiobtn = Dokument.querySelectorAll ('input [name = "woche"]');
Const SelectedValue = Dokument.getElementById ("Wert");

Definieren Sie eine Funktion namens “überprüfen()"Damit werden die Optionsschaltflächen überprüft"überprüftEigenschaft, erhalten Sie ihre Werte und zeigen Sie sie auf der Webseite an. Es gibt einen booleschen Wert “WAHR"Wenn das Optionsfeld überprüft wird und"FALSCHWenn niemand überprüft wird:

Funktionsprüfung()
Tag Tag;
für (const Radio von radioBtn)
if (Radio.geprüft)
Tag = Radio.Wert;
brechen;


if (Tag)
SelectedValue.InnerText = 'ausgewählter Tag ist $ Tag';

anders
SelectedValue.InnerText = 'Bitte wählen Sie ein Optionsfeld aus';

Ausgang

Es geht darum, ein Optionsfeld mit JavaScript zu überprüfen.

Abschluss

Verwenden Sie die “zur Überprüfung eines Optionsfelds mit JavaScript die“überprüftEigenschaft des HTML -Optionsfelds. Es gibt und legt den booleschen Wert fest “WAHR" Und "FALSCH”. Es wird sowohl für die Einstellung als auch für den Wert der Optionsfelder verwendet. In diesem Blog wurde die Prozedur gezeigt, um ein Optionsfeld mit JavaScript zu überprüfen.