webentwicklung-frage-antwort-db.com.de

jQuery/Programmgesteuert eine Option im Auswahlfeld auswählen

Ich verwende derzeit jQuery, um einige JSON-Ergebnisse zurückzugeben. Sobald diese Ergebnisse zurückgegeben werden, verwende ich sie, um Felder in meinem Formular vorab auszufüllen.

Ich brauche jedoch Hilfe bei der Vorauswahl von Elementen in einem Dropdown-Feld. Zum Beispiel habe ich eine Auswahlbox (diese ist verkürzt):

<select id="startTime">
<option value="14:00:00">2:00 pm</option>
<option value="15:00:00">3:00 pm</option>
<option value="16:00:00">4:00 pm</option>
<option value="17:00:00">5:00 pm</option>
<option value="18:00:00">6:00 pm</option>
</select>

Und wenn mein JSON-Wert ist:

 var start_time = data[0].start  // Let's say this is '17:00:00'

Wie kann ich mit jQuery die Option mit dem Wert '17: 00: 00 'auswählen?

 <option value="17:00:00" selected="selected">5:00 pm</option>
45
Dodinas

update:

Mit jQuery 1.9 wurde diese Funktionalität von jQuery aktualisiert. Der "ausgewählte" Status einer Option ist tatsächlich eine Eigenschaft. Daher hat jQuery dies geändert, um die .prop () -Methode zu verwenden. Syntax ist sehr ähnlich und leicht zu wechseln:

$('#startTime option[value=17:00:00]').prop('selected', true);

Siehe http://api.jquery.com/prop/#entry-longdesc , um zu erfahren, warum true übergeben werden muss.


Ältere jQuery

$('#startTime option[value=17:00:00]').attr('selected', 'selected');

oder 

$('#startTime option[value='+ data[0].start +']').attr('selected', 'selected');
78
Sam Hasler
$('#startTime').val(start_time);
33
Corey Ballou

Es ist nur $("#startTime").val(start_time);

10
Jacob Mattison

AKTUALISIEREN

Mit jQuery 1.9 wurde diese Funktionalität von jQuery aktualisiert. Der "ausgewählte" Status einer Option ist tatsächlich eine Eigenschaft. Daher hat jQuery dies geändert, um die .prop () -Methode zu verwenden. Syntax ist sehr ähnlich und leicht zu wechseln:

$('option[value=17:00:00]').prop('selected', 'selected');
10
Joshua

Zusätzliche Informationen für jquery mobile Benutzer (1.3.0):

Hier ist ein ähnliches Beispiel .

Wenn Sie das obige Beispiel mit jquery 1.9.1 und jquery mobile 1.3.0 versuchen, können Sie feststellen, dass es nicht funktioniert, wenn Sie nicht ein hinzufügen

$("#location_list").selectmenu("refresh");

Denken Sie daran, wenn Sie mit jquery mobile arbeiten. Es hat mir viele Kopfschmerzen bereitet

2
John Thompson

Aus irgendeinem Grund funktioniert es für mich so:

$('#startTime').val(''+data[0].start+'');
1
Adrian P.
var varValue="17:00:00";
$("#startTime").ready(function(){ 
   $("#startTime option[value='"+varValue+"']").prop("selected", "selected"); });

Funktioniert für mich auf jQuery 1.10

1
antoshib

$('#startTime').val(start_time);

Wenn Sie nach Auswahl der Option ein ausgewähltes Änderungsereignis auslösen möchten:

$('#startTime').trigger("change");

1
sh497