définir l'option "selected" attribut de l'option de création dynamique

Question

J'ai un dynamique créée, sélectionnez l'option à l'aide de la fonction javascript. sélectionner un objet est

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

lorsque la fonction js est exécuté, le "pays" de l'objet est

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

et l'affichage de "Indonésie" en tant que par défaut de l'option sélectionnée. remarque : il n'y a pas de selected="selected" attribut dans cette option.

alors j'ai besoin de selected="selected" attribut "Indonésie", et j'utilise cette

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

à l'aide de firebug, je vois la "Indonésie" option consiste comme ceci

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

mais il échoue dans IE (testé sous IE 8).

et puis j'ai essayé à l'aide de jQuery

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

il échoue à la fois dans FF et IE

J'ai besoin de la "Indonésie" option doit avoir selected="selected" attribut alors, quand je clique sur le bouton de réinitialisation, il faudra choisir "Indonésie" de nouveau

changement de fonction js à la dynamique de créer des "pays" options n'est pas une option. la solution doit travailler à la fois dans FF et IE

merci

Answer 1

Vous y pensez trop:

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

Answer 2

Bonne question. Vous aurez besoin de modifier le code HTML lui-même plutôt que de compter sur des propriétés DOM.

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

Le code saisit l'élément option pour l'Indonésie, les clones et le place dans une nouvelle div (pas dans le document) pour récupérer le HTML complète de chaîne de caractères: <option value="ID">Indonesia</option>.

Il fait ensuite une chaîne de remplacer pour ajouter l'attribut selected="selected" comme une chaîne de caractères, avant de remplacer l'option d'origine avec cette nouvelle.

Je l'ai testé sur IE7. Voir avec le bouton reset fonctionne correctement ici: http://jsfiddle.net/XmW49/

Answer 3

Au lieu de modifier le code HTML lui-même, vous devez simplement définir la valeur pour laquelle vous souhaitez un élément select:

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

Answer 4

var opt = $("option[val=ID]");
opt.attr('selected','selected');​​

Answer 5

Ce que vous voulez faire est de définir l'attribut selectedIndex de la zone de sélection.

 country.options.selectedIndex = index_of_indonesia;
 

La modification de l'attribut 'sélectionné' ne fonctionnera généralement pas dans IE. Si vous voulez vraiment le comportement que vous décrivez, je vous suggère d'écrire une fonction de réinitialisation javascript personnalisée pour réinitialiser toutes les autres valeurs du formulaire à leur valeur par défaut.