javascript - framework - jquery html>()




jQuery Ottieni l'opzione selezionata da Dropdown (16)

Di solito uso $("#id").val() per restituire il valore dell'opzione selezionata, ma questa volta non funziona. Il tag selezionato ha l'id aioConceptName

codice html

<label>Name</label>
<input type="text" name="name" />
<select id="aioConceptName">
    <option>choose io</option>
    <option>roma</option>
    <option>totti</option>
</select>

È possibile selezionare utilizzando l'opzione selezionata esatta: sotto darà innerText

$("select#aioConceptName > option:selected").text()

Mentre sotto ti darai valore.

$("select#aioConceptName > option:selected").val()

Di solito non dovresti solo ottenere il valore selezionato, ma anche eseguire qualche azione. Quindi, perché non evitare tutta la magia jQuery e basta passare il valore selezionato come argomento alla chiamata di azione?

<select onchange="your_action(this.value)">
   <option value='*'>All</option>
   <option ... />
</select>

Mi sono imbattuto in questa domanda e ho sviluppato una versione più concisa della risposta di Elliot BOnneville:

var conceptName = $('#aioConceptName :selected').text();

o genericamente:

$('#id :pseudoclass')

Questo ti risparmia una chiamata jQuery extra, seleziona tutto in un colpo solo ed è più chiaro (secondo me).


Per chiunque abbia scoperto che la migliore risposta non funziona.

Prova ad usare:

  $( "#aioConceptName option:selected" ).attr("value");

Lavora per me nei progetti recenti, quindi vale la pena esaminarlo.


Probabilmente la soluzione migliore con questo tipo di scenario è utilizzare il metodo di modifica di jQuery per trovare il valore attualmente selezionato, in questo modo:

$('#aioConceptName').change(function(){

   //get the selected val using jQuery's 'this' method and assign to a var
   var selectedVal = $(this).val();

   //perform the rest of your operations using aforementioned var

});

Preferisco questo metodo perché puoi quindi eseguire le funzioni per ciascuna opzione selezionata in un dato campo di selezione.

Spero che sia d'aiuto!


Prova questo per valore ...

$("select#id_of_select_element option").filter(":selected").val();

o questo per il testo ...

$("select#id_of_select_element option").filter(":selected").text();

Puoi usare $("#drpList").val();


Se ti trovi nel contesto dell'evento, in jQuery, puoi recuperare l'elemento opzione selezionato usando:
$(this).find('option:selected') come questo:

$('dropdown_selector').change(function() {
    //Use $option (with the "$") to see that the variable is a jQuery object
    var $option = $(this).find('option:selected');
    //Added with the EDIT
    var value = $option.val();//to get content of "value" attrib
    var text = $option.text();//to get <option>Text</option> content
});

modificare

Come accennato da PossessWithin , La mia risposta risponde alla domanda: Come selezionare l'opzione selezionata.

Quindi, per ottenere il valore dell'opzione, utilizzare option.val() .


Solo questo dovrebbe funzionare:

var conceptName = $('#aioConceptName').val();


Utilizza anche la funzione jQuery.val() per gli elementi selezionati:

Il metodo .val () viene utilizzato principalmente per ottenere i valori degli elementi del modulo come input, select e textarea. Nel caso di elementi selezionati, restituisce null quando nessuna opzione è selezionata e una matrice che contiene il valore di ciascuna opzione selezionata quando ce n'è almeno una ed è possibile selezionare più perché è presente l'attributo multiple .

$(function() {
  $("#aioConceptName").on("change", function() {
    $("#debug").text($("#aioConceptName").val());
  }).trigger("change");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<select id="aioConceptName">
  <option>choose io</option>
  <option>roma</option>
  <option>totti</option>
</select>
<div id="debug"></div>


dovresti usare questa sintassi:

var value = $('#Id :selected').val();

Quindi prova questo codice:

var values = $('#aioConceptName :selected').val();

puoi provare su Fiddle: http://jsfiddle.net/PJT6r/9/

vedi di questa risposta in questo post


prova a questo

$(document).ready(function() {

    $("#name option").filter(function() {
        return $(this).val() == $("#firstname").val();
    }).attr('selected', true);

    $("#name").live("change", function() {

        $("#firstname").val($(this).find("option:selected").attr("value"));
    });
});


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<select id="name" name="name"> 
<option value="">Please select...</option> 
<option value="Elvis">Elvis</option> 
<option value="Frank">Frank</option> 
<option value="Jim">Jim</option> 
</select>

<input type="text" id="firstname" name="firstname" value="Elvis" readonly="readonly">

Imposta i valori per ognuna delle opzioni

<select id="aioConceptName">
    <option value="0">choose io</option>
    <option value="1">roma</option>
    <option value="2">totti</option>
</select>

$('#aioConceptName').val() non ha funzionato perché .val() restituisce l'attributo value . Per farlo funzionare correttamente, gli attributi del value devono essere impostati su ogni <option> .

Ora puoi chiamare $('#aioConceptName').val() invece di tutto questo :selected voodoo :selected viene suggerito da altri.


$('#aioConceptName option:selected').val();

<select id="form-s" multiple="multiple">
    <option selected>city1</option>
    <option selected value="c2">city2</option>
    <option value="c3">city3</option>
</select>   
<select id="aioConceptName">
    <option value="s1" selected >choose io</option>
    <option value="s2">roma </option>
    <option value="s3">totti</option>
</select>
<select id="test">
    <option value="s4">paloma</option>
    <option value="s5" selected >foo</option>
    <option value="s6">bar</option>
</select>
<script>
$('select').change(function() {
    var a=$(':selected').text(); // "city1city2choose iofoo"
    var b=$(':selected').val();  // "city1" - selects just first query !
    //but..
    var c=$(':selected').map(function(){ // ["city1","city2","choose io","foo"]
        return $(this).text();
    }); 
    var d=$(':selected').map(function(){ // ["city1","c2","s1","s5"]
        return $(this).val();
    });
    console.log(a,b,c,d);
});
</script>




html