javascript - selectores - Obteniendo las opciones seleccionadas con querySelectorAll

selectores dom

Question

Me pregunto si es posible en Javascript obtener las opciones actualmente seleccionadas en un campo <select multiple> usando la API de Selctors en lugar de una iteración "estúpida" sobre todas las opciones.

select.querySelectorAll(''option[selected="selected"]'') solo devuelve las opciones que se marcaron como preseleccionadas en el HTML original, que no es lo que estoy buscando. ¿Algunas ideas?

Answer 1

También experimenté tu problema, tengo la sensación de que JavaScript no reconoce los cambios en el DOM.

Aquí hay una solución:

jsFiddle

document.getElementById(''test'').onclick = function () {
var select = document.getElementById(''select'');
var options = getSelectedOptions(select);
console.log(options);
};
function getSelectedOptions(select) {
var result = [];
var options = select.getElementsByTagName(''option'');
for (var i = 0; i < options.length; i++) {
if (options[i].selected)
result.push(options[i]);
};
return result;
}

Answer 2

document.querySelectorAll(''option:checked'')

Funciona incluso en IE9;)