set option "ausgewählt" attribut von dynamisch erstellt option

Question

Ich habe eine dynamisch erstellte wählen option mit einem javascript-funktion. das Objekt auswählen ist

<select name="country" id="country"> 
</select> 

wenn die js-Funktion ausgeführt wird, Objekt das „Land“

<select name="country" id="country"> 
    <option value="AF">Afghanistan</option> 
    <option value="AL">Albania</option> 
    ... 
    <option value="ID">Indonesia</option> 
    ... 
    <option value="ZW">Zimbabwe</option> 
</select> 

ist und „Indonesien“ als Standard-Option angezeigt wird. Hinweis: In dieser Option ist kein selected="selected" Attribut enthalten.

dann muss ich auf selected="selected" Attribut auf „Indonesien“, und ich verwende diesen

var country = document.getElementById("country"); 
country.options[country.options.selectedIndex].setAttribute("selected", "selected"); 

mit Firebug kann ich die „Indonesien“ sehen Option ist wie dieser

<option value="ID" selected="selected">Indonesia</option> 

aber es scheitert in IE (getestet in IE 8).

und dann habe ich versucht, mit jQuery

$(function() { 
    $("#country option:selected").attr("selected", "selected"); 
}); 

versagt es sowohl in FFX und IE.

Ich brauche die Option "Indonesien", um selected="selected" Attribut zu haben, wenn ich auf die Reset-Taste klicke, wird wieder "Indonesien" ausgewählt.

Das Ändern der js-Funktion zum dynamischen Erstellen von Länderoptionen ist keine Option. Die Lösung muss sowohl in FFX als auch in IE funktionieren.

danke

Answer 1

Gute Frage. Sie müssen den HTML-Code selbst ändern, anstatt sich auf DOM-Eigenschaften zu verlassen.

var opt = $("option[val=ID]"), 
    html = $("<div>").append(opt.clone()).html(); 
html = html.replace(/\>/, ' selected="selected">'); 
opt.replaceWith(html); 

Der Code greift die Option Element für Indonesien, Klone es und setzt es in ein neues div (nicht im Dokument) die vollständige HTML-Zeichenfolge abzurufen: <option value="ID">Indonesia</option>.

Es ersetzt dann eine Zeichenfolge, um das Attribut selected="selected"als Zeichenfolge hinzuzufügen, bevor die ursprüngliche Option durch diese neue ersetzt wird.

Ich habe es auf IE7 getestet.Sehen Sie es mit der Reset-Taste richtig, hier zu arbeiten: http://jsfiddle.net/XmW49/

Answer 2

Was möchten Sie die selectedIndex Attribut der Auswahlbox gesetzt zu tun.

Das Ändern des Attributs 'selected' funktioniert normalerweise nicht in IE. Wenn Sie wirklich wollen das Verhalten, das Sie beschreiben, schlage ich vor, Sie schreiben eine benutzerdefinierte JavaScript-Reset-Funktion, um alle anderen Werte im Formular auf ihre Standardwerte zurückzusetzen.

Answer 3

// Get <select> object 
var sel = $('country'); 

// Loop through and look for value match, then break 
for(i=0;i<sel.length;i++) { if(sel.value=="ID") { break; } } 

// Select index 
sel.options.selectedIndex = i; 

Begitu loh.

Answer 4

Sie Grübeln es:

var country = document.getElementById("country"); 
country.options[country.options.selectedIndex].selected = true; 

Answer 5

// get the OPTION we want selected 
var $option = $('#SelectList').children('option[value="'+ id +'"]'); 
// and now set the option we want selected 
$option.attr('selected', true);​​ 

Answer 6

Statt modifizieren, um die HTML selbst sollten Sie setzen einfach den Wert, den Sie ein select-Element soll:

$(function() { 
    $("#country").val("Indonesia"); 
}); 

Answer 7

Dies funktioniert in FF, IE9

var x = document.getElementById("country").children[2]; 
x.setAttribute("selected", "selected"); 

Answer 8

Um die Eingabeoption zur Laufzeit festzulegen, setzen Sie den Wert 'checked'. (auch wenn es keine Checkbox ist)

Wo elem ist ein Verweis auf die Option ausgewählt werden.

So für die obige Frage:

var country = document.getElementById("country"); 
country.options[country.options.selectedIndex].checked=true; 

Dies funktioniert für mich, auch wenn die Optionen nicht in einem eingewickelt werden.

Wenn alle Tags denselben Namen haben, sollten sie die Markierung deaktivieren, wenn das neue markiert ist.

Answer 9

Sie können alle Optionswerte suchen, bis Sie die richtige gefunden haben.

var defaultVal = "Country"; 
$("#select").find("option").each(function() { 

    if ($(this).val() == defaultVal) { 

     $(this).prop("selected", "selected"); 
    } 
}); 

Answer 10

Dies sollte funktionieren.

$("#country [value='ID']").attr("selected","selected"); 

Wenn Sie an das Element Funktionsaufrufe gebunden haben folgen Sie einfach es mit so etwas wie

$("#country").change(); 

Answer 11

Erkenne dies eine alte Frage, aber mit der neueren Version von JQuery können Sie jetzt wie folgt vorgehen:

$("option[val=ID]").prop("selected",true); 

Dies erreicht das gleiche wie Box9 ausgewählte Antwort in einer Zeile.

Answer 12

So viele falsche Antworten!

den Wert festlegen, dass ein Formularfeld auf Zurücksetzen der Form zurückkommen sollte, verwenden Sie die folgenden Eigenschaften:

• Checkbox oder Radioknopf: defaultChecked
• Jede andere <input> Kontrolle: defaultValue
• Option in einer Dropdown-Liste: defaultSelected

So, um die aktuell ausgewählte Option als t anzugeben er default:

var country = document.getElementById("country"); 
country.options[country.selectedIndex].defaultSelected = true; 

Es kann eine gute Idee sein, den defaultSelected Wert für jede Option zu setzen, falls hatte man zuvor eingestellt worden ist:

var country = document.getElementById("country"); 
for (var i = 0; i < country.options.length; i++) { 
    country.options[i].defaultSelected = i == country.selectedIndex; 
} 

Wenn nun das Formular zurückgesetzt wird, wird der ausgewählte Die Option ist diejenige, die Sie angegeben haben.

Answer 13

Ich habe so etwas mit der $(...).val()-Funktion versucht, aber die Funktion war nicht vorhanden. Es stellt sich heraus, dass Sie den Wert manuell auf die gleiche Weise einstellen können Sie es für eine <input> tun:

// Set value to Indonesia ("ID"): 
$('#country').value = 'ID' 

... und es in der Auswahl erhalten die automatisch aktualisiert. Funktioniert zumindest in Firefox; Vielleicht möchten Sie es in den anderen ausprobieren.

Answer 14

select = document.getElementById('selectId'); 
var opt = document.createElement('option'); 
    opt.value = 'value'; 
    opt.innerHTML = 'name'; 
    opt.selected = true; 
    select.appendChild(opt);