Stellen Sie das ausgewählte Radio aus der Radio-Gruppe mit einem Wert ein


152

Warum kämpfe ich damit?

Ich habe einen Wert: 5

Wie überprüfe ich das Optionsfeld der Gruppe "mygroup" mit dem Wert 5?

$("input[name=mygroup]").val(5); // doesn't work?

Antworten:


350

Mit Hilfe der Attributauswahl können Sie das Eingabeelement mit dem entsprechenden Wert auswählen. Dann müssen Sie das Attribut explizit festlegen, indem Sie .attr:

var value = 5;
$("input[name=mygroup][value=" + value + "]").attr('checked', 'checked');

Seit jQuery 1.6 können Sie die .propMethode auch mit einem booleschen Wert verwenden (dies sollte die bevorzugte Methode sein):

$("input[name=mygroup][value=" + value + "]").prop('checked', true);

Denken Sie daran, dass Sie zuerst das markierte Attribut aus einem der Optionsfelder unter einer Optionsfeldgruppe entfernen müssen. Dann können Sie einem der Optionsfelder in dieser Optionsfeldgruppe das aktivierte Merkmal / Attribut hinzufügen.

Code zum Entfernen des aktivierten Attributs aus allen Optionsfeldern einer Optionsfeldgruppe -

$('[name="radioSelectionName"]').removeAttr('checked');

.prop ('geprüft', wahr) ist wahrscheinlich besser oder .is ()
bladefist

3
@bladefist: .iswürde hier nicht helfen, aber ich stimme zu .prop. Es war damals noch nicht verfügbar;) Wird meine Antwort aktualisieren. Vielen Dank!
Felix Kling

4
Wenn der Wert des Optionsfelds eine Dezimalzahl hat, müssen Sie den Wert in Anführungszeichen setzen
Robert

1
@ Robert: Ja, wahrscheinlich. Aus der Dokumentation : "Kann entweder ein einzelnes Wort ohne Anführungszeichen oder eine Zeichenfolge in Anführungszeichen sein."
Felix Kling

4
Siehe Jonathans Antwort. Die jQuery-Dokumente zeigen, dass .val()das Festlegen von Werten in Radio- oder Kontrollkästchengruppen unterstützt wird. Diese Antwort funktioniert technisch, ist aber umständlich und viel weniger lesbar / einprägsam.
Jinglesthula

143

Es gibt eine bessere Möglichkeit, Radios und Kontrollkästchen zu aktivieren. Sie müssen anstelle eines Rohwerts ein Array von Werten an die val-Methode übergeben

Hinweis: Wenn Sie den Wert einfach selbst übergeben (ohne sich in einem Array zu befinden ), werden alle Werte von "mygroup" auf den Wert gesetzt.

$("input[name=mygroup]").val([5]);

Hier ist das jQuery-Dokument, das erklärt, wie es funktioniert: http://api.jquery.com/val/#val-value

Und .val([...])arbeitet auch mit Formelementen wie <input type="checkbox">, <input type="radio">und <option>s innerhalb von ein <select>.

Die Eingaben und Optionen mit einem Wert, der mit einem der Elemente des Arrays übereinstimmt, werden überprüft oder ausgewählt, während diejenigen mit einem Wert, der nicht mit einem der Elemente des Arrays übereinstimmt, deaktiviert oder nicht ausgewählt sind

Fiddle demonstriert diese Arbeitsweise: https://jsfiddle.net/92nekvp3/


Akzeptierte Antwort (sollte es auch sein). Ab jQuery 1.0 siehe letztes Beispiel aus den Dokumenten (nach unten scrollen): api.jquery.com/val Hier kopiert
JoePC

Dies ist eine schöne und konsistente Möglichkeit, alle Eingabewerte festzulegen. Schade, dass ich 6 Jahre gebraucht habe, um davon zu erfahren.
Jeff Lowery

1
Ich habe eine ganze Weile versucht herauszufinden, warum alle meine Werte in der Gruppe auf den übergebenen Wert gesetzt wurden, anstatt den Wert zu überprüfen. Es stellte sich heraus, dass ich den Wert selbst übergeben habe, nicht innerhalb eines Arrays.
OXiGEN


8
$("input[name='mygroup'][value='5']").attr("checked", true);

7

Wenn Sie den Attributwert wie oben erwähnt ändern, wird das changeEreignis nicht ausgelöst. Wenn dies aus bestimmten Gründen erforderlich ist, können Sie es wie folgt auslösen

$('input[name=video_radio][value="' + r.data.video_radio + '"]')
       .prop('checked', true)
       .trigger('change');


1

Oder Sie können einfach ein Wertattribut schreiben:

$(':radio[value=<yourvalue>]').attr('checked',true);

Das funktioniert bei mir.


0
var key = "Name_radio";
var val = "value_radio";
var rdo = $('*[name="' + key + '"]');
if (rdo.attr('type') == "radio") {
 $.each(rdo, function (keyT, valT){
   if ((valT.value == $.trim(val)) && ($.trim(val) != '') && ($.trim(val) != null))

   {
     $('*[name="' + key + '"][value="' + (val) + '"]').prop('checked', true);
   }
  })
}

4
Können Sie bitte erklären, was Ihr Code in Ihrer Antwort bewirkt? Zumindest ein Satz oder so. Und wie es die Lösung löst. Danke dir.
Alex

0

Reine JavaScript-Version:

document.querySelector('input[name="myradio"][value="5"]').checked = true;

-1
$('input[name="mygroup"]').val([5])

1
Können Sie erklären, was Ihre Lösung von den anderen bereits bereitgestellten Lösungen unterscheidet?
Giovani Vercauteren

@Giovani Vercauteren, wir sollten den Namen als Zeichenfolge angeben. Also gebe ich die mygroup als String im Code an.
Anjitha
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.