web-dev-qa-db-fra.com

Comment sélectionner le premier élément du menu déroulant à l'aide de jQuery?

Je veux savoir comment sélectionner la première option dans toutes les balises de sélection de ma page à l'aide de jQuery.

essayé ceci:

$('select option:nth(0)').attr("selected", "selected");

Mais n'a pas fonctionné

javascriptjqueryhtml
103
Amr Elgarhy

Essayez ceci ...

$('select option:first-child').attr("selected", "selected");

Une autre option serait la suivante, mais cela ne fonctionnera que pour une liste déroulante à la fois, comme indiqué ci-dessous:

var myDDL = $('myID');
myDDL[0].selectedIndex = 0;

Jetez un coup d'œil à cet article sur la définition d'une valeur, intéressante mais qui ne vous aidera pas pour ce problème spécifique:

Change la valeur sélectionnée d'une liste déroulante avec jQuery

188
RSolberg

Votre sélecteur est faux, vous cherchiez probablement

$('select option:nth-child(1)')

Cela fonctionnera aussi:

$('select option:first-child')
13
Aistina

Ana Solution alternative pour RSolgberg, qui tire le 'onchange' événement si présent:

$("#target").val($("#target option:first").val());

Comment faire en sorte que la première option de <select> soit sélectionnée avec jQuery?

10
Muhammad Omar ElShourbagy
$("#DDLID").val( $("#DDLID option:first-child").val() );

Pour les opérations complètes dans la liste déroulante à l'aide de Jquery

5
vijay

Ce que vous voulez c'est probablement:

$("select option:first-child")

Ce que ce code

attr("selected", "selected");

est en train de définir l'attribut "sélectionné" sur "sélectionné"

Si vous voulez les options sélectionnées, que ce soit le premier enfant ou non, le sélecteur est:

$("select").children("[selected]")
4
RichN

Voici une solution simple javascript qui fonctionne dans la plupart des cas:

document.getElementById("selectId").selectedIndex = "0";
2
Jagruti

Je réponds parce que les réponses précédentes ont cessé de fonctionner avec la dernière version de jQuery. Je ne sais pas quand cela a cessé de fonctionner, mais la documentation indique que .prop () est la méthode préférée pour obtenir/définir les propriétés depuis jQuery 1.6.

Voici comment je l’ai fait (avec jQuery 3.2.1):

$('select option:nth-child(1)').prop("selected", true);

J'utilise knockoutjs et les liaisons de modification ne se déclenchent pas avec le code ci-dessus, j'ai donc ajouté .change () à la fin.

Voici ce dont j'avais besoin pour ma solution:

$('select option:nth-child(1)').prop("selected", true).change();

Voir les notes .prop () dans la documentation ici: http://api.jquery.com/prop/

2
Brandon

si vous voulez vérifier le texte de l'option sélectionnée, que ce soit le 1er enfant ou non.

var a = $("#select_id option:selected").text();
alert(a); //check if the value is correct.
if(a == "value") {-- execute code --}
1
sarah
    var arr_select_val=[];

    $("select").each(function() { 
        var name=this.name;
            arr_select_val[name]=$('select option:first-child').val();
    });


// Process the array object
     $('.orders_status_summary_div').print(arr_select_val);
1
ShivarajRH