2010-11-27 8 views
5

Ich erstelle eine Auswahlliste mit Optionselementen in jQuery. Vereinfacht sieht es so aus:Setzen des ausgewählten Attributs auf einem Optionselement für Real mit jQuery

var sel = $("<select>"); 
$.each(data, function(i, v){ 
    $("<option>").attr({ "value": i }).html(v).appendTo(sel); 
}); 

Dann möchte ich eine Option ausgewählt werden. Normalerweise würde ich etwas tun wie:

$(sel).val(1); 

Aber dann die Option nicht das ausgewählte Attribut vorhanden.

$(sel).html() gibt so etwas wie:

<option value="1">1</option> 
<option value="2">2</option> 

und das ist, was ich erwartet hatte:

<option value="1" selected="selected">1</option> 
<option value="2">2</option> 

ich diesen Ansatz versucht (gleiche Ergebnis wie mit .val()):

$.each(data, function(i, v){ 
    var attrs = { "value": i }; 
    if(i == 1){ 
     attrs.selected = "selected"; 
    } 
    $("<option>").attr(attrs).html(v).appendTo(sel); 
}); 

aber der einzige Weg, fand ich Arbeits ist:

$.each(data, function(i, v){ 
    var el = "<option>"; 
    if(i == 1){ 
     el = '<option selected="selected"></option>'; 
    } 
    $(el).attr({ "value": i }).html(v).appendTo(sel); 
}); 

Gibt es einen anderen oder besseren Weg?

Antwort

7

könnten Sie die native setAttribute() method verwenden. Ich glaube, jQuery verwirrt die Unterscheidung zwischen Attributen und Eigenschaften.

Dies wird die <option> Sie von den Ergebnissen des Index aus dem <select> Element wollen options collection und setzt das Attribut:

sel[0].options[1].setAttribute('selected','selected'); 

Oder diese nutzt jQuery den Wert zuerst zu setzen, dann geht zurück und bekommt die richtige Option die native selectedIndex property.

sel.val(1); 
sel[0].options[sel[0].selectedIndex].setAttribute('selected','selected'); 

EDIT: Off Thema ein wenig, aber man konnte die <option> Elemente ein wenig anders wie folgt erstellen:

$("<option>",{ 
    value: i, 
    html: v 
}).appendTo(sel); 

Seit jQuery 1.4 können Sie eine Sammlung von Werten senden Sie möchten für ein neues Element festlegen.

+1

+1 - http://jsfiddle.net/QFFeF/1/ – karim79

+1

Hat die jQuery-Quelle und -Attr-Abschnitte überprüft, wenn sie ausgewählt wurde, und verwendet auch selectedIndex. Danke für die Antwort - einfach zu vergessen, dass es eine Zeit vor jQuery gab :) – sunn0