Comment puis-je définir par programmation la valeur d'un élément de boîte de sélection en utilisant javascript?

Question

J’ai l’élément select HTML suivant :

À l’aide d’une fonction javascript avec le numéro de code de congé en tant que paramètre, comment choisir l’option appropriée dans la liste ?

Answer 1

function SelectElement(valueToSelect)
{    
    var element = document.getElementById('leaveCode');
    element.value = valueToSelect;
}

Answer 2

Si vous utilisez jQuery, vous pouvez aussi le faire

 $("#leaveCode").val("14");
 

Cela sélectionnera l'option avec la valeur de 14

Answer 3

function setSelectValue (id, val) {
    document.getElementById(id).value = val;
}
setSelectValue('leaveCode', 14);

Answer 4

J'ai comparé les différentes méthodes:

Comparaison de différentes façons sur la façon de définir une valeur d'un select avec JS ou jQuery

code:

$(function() {
    var oldT = new Date().getTime();
     var element = document.getElementById('myId');
    element.value = 4;
    console.error(new Date().getTime() - oldT);


    oldT = new Date().getTime();
    $("#myId option").filter(function() {
        return $(this).attr('value') == 4;
    }).attr('selected', true);
    console.error(new Date().getTime() - oldT);


    oldT = new Date().getTime();
    $("#myId").val("4");
    console.error(new Date().getTime() - oldT);


});

Sortie sur un select avec ~4000 éléments:

1 ms

58 ms

612 ms

Avec Firefox 10. Remarque: La seule raison pour laquelle j'ai fait ce test, parce que jQuery effectué super mal sur notre liste avec ~2000 entrées (ils avaient des textes plus longs entre les options). Nous avions à peu près 2 s temporisation après un val()

Note: je suis à la valeur de réglage selon la valeur réelle, et non pas la valeur de texte

Answer 5

 document.getElementById('leaveCode').value = '10';
 

Cela devrait définir la sélection à "Congé annuel"