nastavit možnost „vybraný“ atribut z dynamicky vytvořené možnosti

Mám dynamicky vytvořenou možnost výběru pomocí funkce javascript. vybraný objekt je

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

když je funkce js spuštěna, objekt „country“ je

<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>

a zobrazení „Indonésie“ jako výchozí vybranou možnost. poznámka:není tam žádný selected="selected" atribut v této možnosti.

pak musím nastavit selected="selected" atribut „Indonésie“ a používám toto

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

pomocí firebugu vidím, že možnost „Indonésie“ vypadá takto

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

ale selže v IE (testováno v IE 8).

a pak jsem zkusil použít jQuery

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

selže v FFX i IE.

Potřebuji, aby možnost „Indonésie“ měla selected="selected" atribut, takže když kliknu na tlačítko reset, znovu se vybere „Indonésie“.

změna funkce js pro dynamické vytváření možností „země“ není možná. řešení musí fungovat v FFX i IE.

děkuji

Odpověď

Dobrá otázka. Budete muset upravit samotný HTML, než se spoléhat na vlastnosti DOM.

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

Kód uchopí prvek volby pro Indonésii, naklonuje jej a vloží do nového prvku div (nikoli v dokumentu), aby získal celý řetězec HTML:<option value="ID">Indonesia</option> .

Poté nahradí řetězec a přidá atribut selected="selected" jako řetězec , než původní možnost nahradíte touto novou.

Testoval jsem to na IE7. Podívejte se na to, jak správně funguje tlačítko reset zde:http://jsfiddle.net/XmW49/