jQuery get selected option value (not the text, but the attribute 'value')

问题

Okay, I have this code:

<select name=\"selector\" id=\"selector\">
<option value=\"1\">Option 1</option>
<option value=\"2\">Option 2</option>
</select>

And I\'d like to get the value of the option selected. Example: \'Option 2\' is selected, and the value of it is \'2\'. The \'2\' is the value I need to get and not \'Option 2\'.

回答1:

Use .val to get the value of the selected option. See below,

$('select[name=selector]').val()

回答2:

I just wanted to share my experience

For me,

$('#selectorId').val()

returned null.

I had to use

$('#selectorId option:selected').val()

回答3:

$('select').change(function() {
    console.log($(this).val())
});​

jsFiddle example

.val() will get the value.

回答4:

You need to add an id to your select. Then:
$('#selectorID').val()

回答5:

you can use jquery as follows

SCRIPT

  $('#IDOfyourdropdown').change(function(){
    alert($(this).val());
  });

FIDDLE is here

回答6:

Try this:

$(document).ready(function(){
    var data= $('select').find('option:selected').val();
});

or

var data= $('select').find('option:selected').text();

回答7:

For a select like this

<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
   <option id="0">CHOOSE AN OPTION</option>
   <option id="127">John Doe</option>
   <option id="129" selected>Jane Doe</option>

... you can get the id this way:

$('#list-name option:selected').attr('id');

Or you can use value instead, and get it the easy way...

<select class="btn btn-info pull-right" id="list-name" style="width: auto;">
   <option value="0">CHOOSE AN OPTION</option>
   <option value="127">John Doe</option>
   <option value="129" selected>Jane Doe</option>

like this:

$('#list-name').val();

回答8:

One of my options didn't have a value: <option>-----</option>. I was trying to use if (!$(this).val()) { .. } but I was getting strange results. Turns out if you don't have a value attribute on your <option> element, it returns the text inside of it instead of an empty string. If you don't want val() to return anything for your option, make sure to add value="".

回答9:

Look at the example:

    <select class="element select small" id="account_name" name="account_name"> 

        <option value="" selected="selected">Please Select</option>           
        <option value="paypal" >Paypal</option>
        <option value="webmoney" >Webmoney</option>

    </select>

 <script type="text/javascript">

        $(document).ready(function(){ 
             $('#account_name').change(function(){
               alert($(this).val());                                                          
             });
        });
 </script>

回答10:

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

OR

$('select[name=selector]').val();

OR

$('.class_nam').val();

回答11:

this code work very well for me: this return the value of selected option. $('#select_id').find('option:selected').val();

回答12:

 $(document ).ready(function() {
    $('select[name=selectorname]').change(function() { 
     alert($(this).val());});
 });

来源：https://stackoverflow.com/questions/13089944/jquery-get-selected-option-value-not-the-text-but-the-attribute-value