616 votos

Agregar opciones a un select usando Jquery/javascript

¿Cuál es la forma más fácil para agregar una opción a un menú desplegable con javascript? ¿Este trabajo?

$("#mySelect").append('<option value=1>My option</option>');

694voto

dule Puntos 1830

Personalmente, prefiero esta sintaxis para anexar las opciones:

$('#mySelect').append($('<option>', {
    value: 1,
    text: 'My option'
}));

Si usted está agregando opciones de una colección de artículos, puede hacer lo siguiente:

$.each(items, function (i, item) {
    $('#mySelect').append($('<option>', { 
        value: item.value,
        text : item.text 
    }));
});

214voto

tvanfosson Puntos 268301

Yo creo que es la forma más fácil. Tal vez te interese este cheat sheet (PDF) sobre el uso de jQuery con selecciona para más información.

143voto

Josh Puntos 831

Estoy de acuerdo Ashish, esto no funcionó en IE8 (aún así hizo en FF):

$("#selectList").append(new Option("option text", "value"));

Esto funcionó:

var o = new Option("option text", "value");
/// jquerify the DOM object 'o' so we can use the html method
$(o).html("option text");
$("#selectList").append(o);

43voto

bobince Puntos 270740

Si el nombre de opción o valor es dinámico, no querrás tener que preocuparse por escapar caracteres especiales en esto quizás usted prefiera usar métodos DOM simples:

var s= document.getElementById('mySelect');
s.options[s.options.length]= new Option('My option', '1');

Iteramos.com

Iteramos es una comunidad de desarrolladores que busca expandir el conocimiento de la programación mas allá del inglés.
Tenemos una gran cantidad de contenido, y también puedes hacer tus propias preguntas o resolver las de los demás.

Powered by:

X