javascript - prima - load jquery ready




jQuery ottiene il testo del tag dell'opzione specifico (14)

  1. Se nella pagina è presente un solo tag select, è possibile specificare select all'interno dell'id 'list'

    jQuery("select option[value=2]").text();
    
  2. Per ottenere il testo selezionato

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

Va bene, dì che ho questo:

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

Che aspetto avrebbe il selettore se volessi ottenere "Opzione B" quando avrò il valore "2"?

Si noti che questo non sta chiedendo come ottenere il valore del testo selezionato , ma solo uno qualsiasi di essi, selezionato o meno, a seconda dell'attributo valore. Provai:

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

Ma non sta funzionando.


È possibile ottenere uno dei seguenti modi

$("#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>


Basato sull'HTML originale pubblicato da Paolo, ho trovato il seguente.

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

È stato testato per funzionare su Internet Explorer e Firefox.


Come soluzione alternativa, puoi anche utilizzare una parte di contesto del selettore jQuery per trovare <option> elemento (i) con value="2" all'interno dell'elenco a discesa:

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

Prova quanto segue:

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

Il motivo per cui il tuo snippet originale non funzionava è perché i tag OPTION sono figli del tuo tag SELECT , che ha la list id .


Puoi ottenere il testo dell'opzione selezionato usando la funzione .text();

puoi chiamare la funzione in questo modo:

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

Questo ha funzionato perfettamente per me, stavo cercando un modo per inviare due valori diversi con le opzioni generate da MySQL e quanto segue è generico e dinamico:

$(this).find("option:selected").text();

Come menzionato in uno dei commenti. Con questo sono stato in grado di creare una funzione dinamica che funziona con tutte le mie caselle di selezione che voglio ottenere entrambi i valori, il valore dell'opzione e il testo.

Pochi giorni fa ho notato che durante l'aggiornamento di jQuery da 1.6 a 1.9 del sito ho usato questo codice, questo smesso di funzionare ... probabilmente era un conflitto con un altro pezzo di codice ... comunque, la soluzione era quella di rimuovere l'opzione dal find () chiama:

$(this).find(":selected").text();

Questa era la mia soluzione ... usala solo se hai qualche problema dopo aver aggiornato il tuo jQuery.


Se desideri ottenere l'opzione con un valore di 2, utilizza

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

Se desideri ottenere l'opzione attualmente selezionata, utilizza

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

Stavo cercando di ottenere val per nome di campo interno anziché ID e sono venuto da Google a questo post che aiuta ma non ha trovato la soluzione di cui ho bisogno, ma ho ottenuto la soluzione ed eccolo qui:

Quindi questo potrebbe aiutare qualcuno che cerca il valore selezionato con il nome interno del campo invece di usare l'ID lungo per gli elenchi di SharePoint:

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


Volevo ottenere l'etichetta selezionata. Questo ha funzionato per me in jQuery 1.5.1.

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

Volevo una versione dinamica per selezionare multiple che visualizzasse ciò che è selezionato a destra (vorrei leggere e vedere $(this).find ... in precedenza):

<script type="text/javascript">
    $(document).ready(function(){
        $("select[showChoices]").each(function(){
            $(this).after("<span id='spn"+$(this).attr('id')+"' style='border:1px solid black;width:100px;float:left;white-space:nowrap;'>&nbsp;</span>");
            doShowSelected($(this).attr('id'));//shows initial selections
        }).change(function(){
            doShowSelected($(this).attr('id'));//as user makes new selections
        });
    });
    function doShowSelected(inId){
        var aryVals=$("#"+inId).val();
        var selText="";
        for(var i=0; i<aryVals.length; i++){
            var o="#"+inId+" option[value='"+aryVals[i]+"']";
            selText+=$(o).text()+"<br>";
        }
        $("#spn"+inId).html(selText);
    }
</script>
<select style="float:left;" multiple="true" id="mySelect" name="mySelect" showChoices="true">
    <option selected="selected" value=1>opt 1</option>
    <option selected="selected" value=2>opt 2</option>
    <option value=3>opt 3</option>
    <option value=4>opt 4</option>
</select>

$("#list option:selected").each(function() {
   alert($(this).text());
});  

per più valori selezionati nell'elemento #list .


$(this).children(":selected").text()




jquery-selectors