javascript - jQuery obtener texto de etiqueta de opción específica



10 Answers

Si desea obtener la opción con un valor de 2, use

$("#list option[value='2']").text();

Si desea obtener la opción seleccionada actualmente, use

$("#list option:selected").text();
javascript jquery drop-down-menu jquery-selectors

Muy bien, digamos que tengo esto:

<select id='list'>
    <option value='1'>Option A</option>
    <option value='2'>Option B</option>
    <option value='3'>Option C</option>
</select>

¿Cómo sería el selector si quisiera obtener la "Opción B" cuando tengo el valor '2'?

Tenga en cuenta que esto no es preguntar cómo obtener el valor de texto seleccionado , sino cualquiera de ellos, ya sea seleccionado o no, dependiendo del atributo de valor. Lo intenté:

$("#list[value='2']").text();

Pero no está funcionando.




Basado en el HTML original publicado por Paolo, se me ocurrió lo siguiente.

$("#list").change(function() {
    alert($(this).find("option:selected").text()+' clicked!');
});

Se ha probado que funciona en Internet Explorer y Firefox.




  1. Si solo hay una etiqueta de selección en la página, puede especificar seleccionar dentro de id 'lista'

    jQuery("select option[value=2]").text();
    
  2. Para obtener texto seleccionado

    jQuery("select option:selected").text();
    



Esta es una pregunta antigua que no se ha actualizado en algún momento, la forma correcta de hacerlo ahora sería utilizar

$("#action").on('change',function() {
    alert($(this).find("option:selected").text()+' clicked!');
});

Espero que esto ayude :-)




Quería obtener la etiqueta seleccionada. Esto me funcionó en jQuery 1.5.1.

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



Puede obtener el texto de la opción seleccionada usando la función .text();

Puedes llamar a la función así:

jQuery("select option:selected").text();



Utilizar:

function selected_state(){
    jQuery("#list option").each(function(){
        if(jQuery(this).val() == "2"){
            jQuery(this).attr("selected","selected");
            return false;
        }
    });
}

jQuery(document).ready(function(){
    selected_state();
});



Necesitaba esta respuesta ya que estaba tratando con un objeto de lanzamiento dinámico, y los otros métodos aquí no parecían funcionar:

element.options[element.selectedIndex].text

Por supuesto, esto usa el objeto DOM lugar de analizar su HTML con nodeValue, childNodes, etc.




Como solución alternativa, también puede usar una parte de contexto del selector jQuery para encontrar <option> elemento (s) con value="2" dentro de la lista desplegable:

$("option[value='2']", "#list").text();



Puede obtener una de las siguientes formas

$("#list").find('option').filter('[value=2]').text()

$("#list").find('option[value=2]').text()

$("#list").children('option[value=2]').text()

$("#list option[value='2']").text()

$(function(){    
    
    console.log($("#list").find('option').filter('[value=2]').text());
    console.log($("#list").find('option[value=2]').text());
    console.log($("#list").children('option[value=2]').text());
    console.log($("#list option[value='2']").text());
    
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select id='list'>
    <option value='1'>Option A</option>
    <option value='2'>Option B</option>
    <option value='3'>Option C</option>
</select>






Related