jQuery: obtenga el texto seleccionado como una coma separada del cuadro de selección

3 minutos de lectura

avatar de usuario de monda
Monda

<select id="testID" multiple="multiple">
   <option value="1">test Value1</option>
   <option value="2">test Value2</option>
   <option value="3">test Value3</option>
   <option value="4">test Value4</option>
   <option value="5">test Value5</option>
  <option value="6">test Value6</option>
</select>

<input type="button" value="Get dropdown selected Value" id ="select-values">

Quiero obtener el texto seleccionado separado por comas.

Lo intenté ,

 $("#select-values").click(function () {
     $("select option:selected").text();
});

digamos que he seleccionado las dos primeras opciones de selección pero obtengo el valor test Value1test Value2

quiero que sea test Value1,test Value2

Tushar Gupta - avatar de usuario de tushar curioso
Tushar Gupta – tushar curioso

Intentar

demostración de violín

$("#select-values").click(function () {
    var option_all = $("select option:selected").map(function () {
        return $(this).text();
    }).get().join(',');
    console.log(option_all);
});

  • has definido corregir la variable var option option_all =?

    – jogesh_pi

    25 de noviembre de 2013 a las 11:46

  • @jogesh_pi lo siento, fue un error tipográfico. demostración agregada también verifique

    – Tushar Gupta – tushar curioso

    25 de noviembre de 2013 a las 11:46


  • genial … funciona muy bien, +1, solo para mi información, ¿puede seleccionar los valores al hacer clic en el botón para que se muestren individualmente al hacer clic sin seleccionarlos para que se muestren? – @TusharGupta

    – Nitesh

    25 de noviembre de 2013 a las 11:57


  • @NathanLee, no entendí lo que estás pidiendo.

    – Tushar Gupta – tushar curioso

    25 de noviembre de 2013 a las 12:04

  • Cuando presiona el botón ‘Obtener valor seleccionado desplegable’, los valores de cada cuadro deben imprimirse en la siguiente línea sin seleccionarlos para imprimir y cada impresión debe estar en un orden uniforme, por ejemplo, cuando hace clic en ‘Obtener valor desplegable el botón Valor seleccionado, valor de prueba 1, valor de prueba 2, etc. deben imprimirse individualmente en la siguiente línea con cada clic. ¿Es eso posible? – @TusharGupta

    – Nitesh

    25 de noviembre de 2013 a las 12:08


Esta se siente como la forma más rápida:

$('#testID').val().toString()

Soy demasiado perezoso para escribir un ciclo for para esto

  • funciona genial! ya que puede usar los valores ya almacenados en caché en caso de que los haya obtenido antes, ¡pero solo funcionarán cuando el texto de la opción y los valores sean los mismos!

    – plata elad

    14/09/2017 a las 18:51


Intentar:

var elementos seleccionados = ($.mapa($(“seleccionar[id*=select-values] opción:seleccionado”), function(elemento, i) { return $(elemento).text() })).join(“, “);

avatar de usuario de rajesh kakawat
rajesh kakawat

Prueba algo como esto

$(document).ready(function () {
    $("#select-values").click(function () {
        var val = [];
        $("select option:selected").each(function () {
            val.push(this.text);
        });
        alert(val.join(','));
    });
});

avatar de usuario de nkmol
nkmol

¿Sabías cuándo quieres obtener un valor de un cuadro de selección múltiple, lo hace automáticamente? ^^

Simplemente cambie el valor de sus selecciones:

<select id="testID" multiple="multiple">
   <option value="test Value1">test Value1</option>
   <option value="test Value2">test Value2</option>
   <option value="test Value3">test Value3</option>
   <option value="test Value4">test Value4</option>
   <option value="test Value5">test Value5</option>
  <option value="test Value6">test Value6</option>
</select>

Entonces puedes llamar al valor con:

$('#testID').val();

Separará automáticamente los valores con una coma.

jsviolín

Intentar:

$("#select-values").click(function () {
    var select = "";
    $("select option:selected").each(function(){
        select += ","+$(this).text();
    });
    if(select != ""){
        select = select.substr(1);
    }
    $("#selection").text(select);
});

Violín aquí.

Avatar de usuario de Bill_VA
Factura_VA

Mantenlo simple

$('#testID').val().join(', ');

¿Ha sido útil esta solución?