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