javascript obtener - Obtenga el texto seleccionado de una lista desplegable(cuadro de selección)usando jQuery





valor select (25)


Seleccione Texto y valor seleccionado en el menú desplegable / seleccione cambio en jQuery

$("#yourdropdownid").change(function() {
    console.log($("option:selected", this).text()); //text
    console.log($(this).val()); //value
})

¿Cómo puedo obtener el texto seleccionado (no el valor seleccionado) de una lista desplegable en jQuery?




Si desea el resultado como una lista, use:

x=[];
$("#list_id").children(':selected').each(function(){x.push($(this).text());})



Esto funciona para mi

$("#dropdownid").change(function() {
    alert($(this).find("option:selected").text());
});

Si el elemento creado dinámicamente

$(document).on("change", "#dropdownid", function() {
    alert($(this).find("option:selected").text());
});



$(function () {
  alert('.val() = ' + $('#selectnumber').val() + '  AND  html() = ' + $('#selectnumber option:selected').html() + '  AND .text() = ' + $('#selectnumber option:selected').text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head runat="server">
    <title></title>

  </head>
  <body>
    <form id="form1" runat="server">
      <div>
        <select id="selectnumber">
          <option value="1">one</option>
          <option value="2">two</option>
          <option value="3">three</option>
          <option value="4">four</option>
        </select>

      </div>
    </form>
  </body>
</html>




$("#dropdownID").change(function(){
  alert($('option:selected', $(this)).text());
});



$("select[id=yourDropdownid] option:selected").text()

Esto funciona bien




$("option:selected", $("#TipoRecorde")).text()



var e = document.getElementById("dropDownId");
var div = e.options[e.selectedIndex].text;



$("#yourdropdownid option:selected").text();



Para obtener valor de uso seleccionado

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

y para obtener el texto del artículo seleccionado use esta línea:

$("#dropDownId option:selected").text();



$("#dropdownid option:selected").text();

si usas asp.net y escribes

<Asp:dropdownlist id="ddl" runat="Server" />

entonces deberías usar

$('#<%=ddl.Clientid%> option:selected').text();



Las respuestas publicadas aquí, por ejemplo,

$('#yourdropdownid option:selected').text();

no funcionó para mí, pero esto hizo:

$('#yourdropdownid').find('option:selected').text();

Posiblemente sea una versión más antigua de jQuery.




Por favor use este

var listbox = document.getElementById("yourdropdownid");
var selIndex = listbox.selectedIndex;
var selValue = listbox.options[selIndex].value;
var selText = listbox.options[selIndex].text;   

Entonces, por favor, alerta "selValue" y "selText". Obtienes el valor y el texto desplegables seleccionados




Utilizar:

('#yourdropdownid').find(':selected').text();



Para selecciones múltiples:

$("#yourdropdownid :selected").map(function(i, v) { return $.trim($(v).text()); }






$('#id').find('option:selected').text();



 $("#selectID option:selected").text();

En lugar de #selectID puede usar cualquier selector de jQuery, como .selectClass utilizando la clase.

Como se menciona en la documentación here .

El selector seleccionado funciona para los elementos de la opción. No funciona para casillas de verificación o entradas de radio; uso :checked para ellos.

.text () Según la documentación here .

Obtenga los contenidos de texto combinados de cada elemento en el conjunto de elementos emparejados, incluidos sus descendientes.

Por lo tanto, puede tomar texto de cualquier elemento HTML utilizando el método .text() .

Consulte la documentación para una explicación más profunda.




lo siguiente funcionó para mí:

$.trim($('#dropdownId option:selected').html())



En caso de hermanos

<a class="uibutton confirm addClient" href="javascript:void(0);">ADD Client</a>
<input type="text" placeholder="Enter client name" style="margin: 5px;float: right" class="clientsearch large" />
<select class="mychzn-select clientList">
  <option value="">Select Client name....</option>
  <option value="1">abc</option>
</select>


 /*jQuery*/
 $(this).siblings('select').children(':selected').text()



Prueba esto:

$("#myselect :selected").text();

Para un menú desplegable de ASP.NET puede usar el siguiente selector:

$("[id*='MyDropDownId'] :selected")



Para el texto del artículo seleccionado, use:

$('select[name="thegivenname"] option:selected').text();

Para el valor del artículo seleccionado, use:

$('select[name="thegivenname"] option:selected').val();



var someName = "Test";

$("#<%= ddltest.ClientID %>").each(function () {
    $('option', this).each(function () {
        if ($(this).text().toLowerCase() == someName) {
            $(this).attr('selected', 'selected')
        };
    });
});

Eso te ayudará a conseguir la dirección correcta. El código anterior está completamente probado si necesita más ayuda, hágamelo saber.




Para aquellos que están usando listas de SharePoint y no quieren usar la identificación generada por mucho tiempo, esto funcionará:

var e = $('select[title="IntenalFieldName"] option:selected').text();



Estoy usando esto:

    $.fn.ifExists = function(fn) {
      if (this.length) {
        $(fn(this));
      }
    };
    $("#element").ifExists( 
      function($this){
        $this.addClass('someClass').animate({marginTop:20},function(){alert('ok')});               
      }
    ); 

Ejecute la cadena solo si existe un elemento jQuery - http://jsfiddle.net/andres_314/vbNM3/2/





javascript jquery drop-down-menu jquery-selectors