Como llegar a todas las opciones de un selecto usando jQuery?

Question

¿Cómo puedo obtener todas las opciones de un selecto través de jQuery mediante la transmisión de su identificación?

Sólo estoy buscando para obtener sus valores, no el texto.

Answer 1

Uso:

$("#id option").each(function()
{
    // Add $(this).val() to your list
});

each () | jQuery API Documentación

Answer 2

No sé jQuery, pero sí sé que si obtiene el elemento de selección, que contiene un objeto 'opciones'.

var myOpts = document.getElementById('yourselect').options;
alert(myOpts[0].value) //=> Value of the first option

Answer 3

$.map es probablemente la forma más eficiente de hacer esto.

var options = $('#selectBox option');

var values = $.map(options ,function(option) {
    return option.value;
});

Puede añadir opciones de cambio a $('#selectBox option:selected') si solo deseas las que se han seleccionado.

La primera línea selecciona todas las casillas de verificación y la pone su elemento jQuery en una variable. A continuación, utilizamos la función .map de jQuery para aplicar una función a cada uno de los elementos de esa variable; lo único que hacemos es devolver el valor de cada elemento como que es todo lo que importa. Porque les estamos devolviendo el interior de la función de mapa de lo que realmente construye una matriz de los valores tal y como solicitó.

Answer 4

Algunas respuestas utiliza each, pero map es una alternativa mejor aquí en mi humilde opinión:

$("select#example option").map(function() {return $(this).val();}).get();

Hay (al menos) dos funciones map en jQuery. La respuesta de Thomas Petersen utiliza "Utilidades / jQuery.map"; esta respuesta utiliza "Desplazar / mapa" (y por lo tanto un poco de código más limpio).

Depende de lo que se va a ver con los valores. Si, digamos, quiere volver los valores de una función, map es probablemente la mejor alternativa. Pero si usted va a utilizar los valores directamente es probable que desee each.

Answer 5

$('select#id').find('option').each(function() {
    alert($(this).val());
});

Answer 6

$("#id option").each(function()
{
    $(this).prop('selected', true);
});

A pesar de que, en el forma correcta es establecer la propiedad DOM del elemento, así:

$("#id option").each(function(){
    $(this).attr('selected', true);
});

Answer 7

Esto hará que los valores de la opción de #myselectbox en un buen conjunto limpia para usted:

// First, get the elements into a list
var domelts = $('#myselectbox option');

// Next, translate that into an array of just the values
var values = $.map(domelts, function(elt, i) { return $(elt).val();});

Answer 8

Puede tomar todas sus "valores seleccionados" por el nombre de las casillas de verificación y presentarlos en una picadura separados por "".

Una buena manera de hacer esto es utilizar jQuery $ .map ():

var selected_val = $.map($("input[name='d_name']:checked"), function(a)
    {
        return a.value;
    }).join(',');

alert(selected_val);

Answer 9

ejemplo

Trabajando

La forma más eficiente de hacer esto es utilizar $.map()

Ejemplo:

var values = $.map($('#selectBox option'), function(ele) {
   return ele.value; 
});

Answer 10

Puede utilizar siguiente código para que:

var assignedRoleId = new Array();
$('#RolesListAssigned option').each(function(){
    assignedRoleId.push(this.value);
});

Answer 11

Para la opción de selección múltiple:

$('#test').val() lista de valores seleccionados regresa. $('#test option').length devuelve el número total de opciones (ambos seleccionado y no seleccionado)

Answer 12

Este es un script sencillo con jQuery:

var items = $("#IDSELECT > option").map(function() {
    var opt = {};
    opt[$(this).val()] = $(this).text();
    return opt;
}).get();
var selectvalues = [];

for(var i = 0; i < items.length; i++) {
    for(key in items[i]) {


        var id = key;
        var text = items[i][key];

        item = {}
        item ["id"] = id;
        item ["text"] = text;

        selectvalues.push(item);

    }
}
console.log(selectvalues);
copy(selectvalues);

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

Answer 13

Este es un ejemplo simple en jQuery para obtener todos los valores, textos, o el valor del elemento seleccionado, o el texto del elemento seleccionado

$('#nCS1 > option').each((index, obj) => {
   console.log($(obj).val());
})

printOptionValues = () => {

  $('#nCS1 > option').each((index, obj) => {
    console.log($(obj).val());
  })

}

printOptionTexts = () => {
  $('#nCS1 > option').each((index, obj) => {
    console.log($(obj).text());
  })
}

printSelectedItemText = () => {
  console.log($('#nCS1 option:selected').text());
}

printSelectedItemValue = () => {
  console.log($('#nCS1 option:selected').val());
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select size="1" id="nCS1" name="nCS1" class="form-control" >
					<option value="22">Australia</option>
          <option value="23">Brunei</option>
          <option value="33">Cambodia</option>
          <option value="32">Canada</option>
          <option value="27">Dubai</option>
          <option value="28">Indonesia</option>
          <option value="25">Malaysia</option>				
</select>
<br/>
<input type='button' onclick='printOptionValues()' value='print option values' />
<br/>
<input type='button' onclick='printOptionTexts()' value='print option texts' />
<br/>
<input type='button' onclick='printSelectedItemText()' value='print selected option text'/>
<br/>
<input type='button' onclick='printSelectedItemValue()' value='print selected option value' />

Answer 14

$("input[type=checkbox][checked]").serializeArray();

O:

$(".some_class[type=checkbox][checked]").serializeArray();

Para ver los resultados:

alert($("input[type=checkbox][checked]").serializeArray().toSource());

Answer 15

Si está buscando todas las opciones con un texto seleccionado a continuación, el código de abajo va a funcionar.

$('#test').find("select option:contains('B')").filter(":selected");