So legen Sie die Radioauswahl basierend auf dem Wert in JQuery fest

Mit der kontinuierlichen Weiterentwicklung der Internet-Technologie ist Front-End zweifellos einer der heißesten Bereiche. In der Front-End-Entwicklung ist jquery eine sehr beliebte JavaScript-Bibliothek und wird häufig bei der Entwicklung und Wartung verschiedener Websites und Anwendungen verwendet. In diesem Artikel werde ich vorstellen, wie man mit jquery die Radioauswahl basierend auf dem Wert festlegt.

1. Einführung in die Funksteuerung

Die Funksteuerung wird auch als Optionsfeld bezeichnet. Es handelt sich um ein Steuerelement in einem HTML-Formular, das es Benutzern ermöglicht, nur eine Option aus mehreren Optionen auszuwählen. Funksteuerungen werden normalerweise mithilfe einer Reihe identischer Optionsfelder implementiert, die in Gruppen organisiert sind, von denen nur eines ausgewählt werden kann.

In HTML werden Radio-Steuerelemente normalerweise mithilfe von Eingabe-Tags definiert, wobei das Typattribut Radio, das Namensattribut der Name einer Reihe von Optionsfeldern und das Wertattribut der Wert jedes Optionsfelds ist, wie unten gezeigt:

<input type="radio" name="gender" value="male"> Male<br>
<input type="radio" name="gender" value="female"> Female<br>

2. So verwenden Sie JQuery, um die Funkauswahl basierend auf dem Wert festzulegen

Manchmal müssen wir JQuery verwenden, um den ausgewählten Status der Funksteuerung dynamisch festzulegen. Im Folgenden werde ich zwei Methoden vorstellen, um den Effekt der Einstellung der Radioauswahl basierend auf dem Wert zu erzielen.

1. Attr-Methode verwenden

attr-Methode wird verwendet, um den Wert des angegebenen Attributs abzurufen oder festzulegen. Beim Auswählen und Deaktivieren der Funksteuerung können Sie diese Methode verwenden, um den Wert des aktivierten Attributs festzulegen.

Zum Beispiel haben wir eine Radio-Kontrollgruppe mit der ID des Geschlechts. Wir können den folgenden Code verwenden, um den ausgewählten Status des entsprechenden Radio-Buttons festzulegen:

// 根据值设置radio选中
$("input[name='gender'][value='male']").attr("checked", true);

// 取消选中
$("input[name='gender'][value='female']").attr("checked", false);

Wie oben gezeigt, wählen wir zuerst die männlichen und weiblichen Singles aus Klicken Sie im Formular über den Selektor auf die Schaltfläche und verwenden Sie dann die attr-Methode, um den Wert des aktivierten Attributs festzulegen, um die Überprüfungs- und Deaktivierungsvorgänge zu implementieren.

2. Verwenden Sie die Prop-Methode

Die Prop-Methode ähnelt im Wesentlichen der Attr-Methode, mit der der Attributwert des Elements abgerufen oder festgelegt wird. Der Unterschied besteht darin, dass die prop-Methode zum Betreiben boolescher Attribute wie aktiviert, ausgewählt, deaktiviert usw. verwendet wird, während die attr-Methode zum Betreiben nicht-boolescher Attribute verwendet wird.

Es ist auch sehr einfach, den aktivierten und nicht aktivierten Status der Funksteuerung über die Prop-Methode festzulegen. Sie müssen außerdem den entsprechenden Selektor verwenden, um die Funksteuerung auszuwählen, und dann die Prop-Methode verwenden, um den Wert ihrer aktivierten Steuerung festzulegen Attribut.

Zum Beispiel kann der folgende Code den ausgewählten und ungeprüften Status der Funksteuerung basierend auf ihrem Wert festlegen:

// 根据值设置radio选中
$("input[name='gender'][value='male']").prop("checked", true);

// 取消选中
$("input[name='gender'][value='female']").prop("checked", false);

3. Zusammenfassung

In diesem Artikel habe ich zwei Methoden zum Festlegen der Funkauswahl basierend auf dem Wert in jquery vorgestellt: Verwenden Sie nämlich die Attr-Methode und die Prop-Methode. Beide Methoden sind sehr einfach: Wählen Sie einfach die Funksteuerung über den Selektor aus und verwenden Sie dann die Methode attr oder prop, um den Wert des aktivierten Attributs festzulegen. Ich hoffe, dass dieser Artikel für alle hilfreich sein kann, die bei der Front-End-Entwicklung auf ähnliche Probleme stoßen.

Das obige ist der detaillierte Inhalt vonSo legen Sie die Radioauswahl basierend auf dem Wert in JQuery fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!