web-dev-qa-db-ja.com

jQueryは選択されたオプション値を取得します(テキストではなく、属性 'value')

さて、私はこのコードを持っています:

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

そして選択したオプションの値を取得したいのですが。例: 'Option 2'が選択されており、その値が '2'です。 '2'は私が取得する必要がある値で、 'Option 2'ではありません。

140
n00b

選択したオプションの値を取得するには、 .val を使用します。下記参照、

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

私は自分の経験を共有したいと思いました

私のために、

$('#selectorId').val()

nullを返しました。

私は使わなければならなかった

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

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

jsFiddleの例

.val()は値を取得します。

22
j08691

あなたの選択にIDを追加する必要があります。その後:
$('#selectorID').val()

8
Marcus

次のようにjqueryを使うことができます。

_ script _

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

FIDDLEは ここ

4
Usman

これを試して:

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

または

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

私のオプションの1つに値がありませんでした:<option>-----</option>if (!$(this).val()) { .. }を使おうとしていましたが、奇妙な結果が得られました。 <option>要素にvalue属性がない場合は、空の文字列ではなくその内部のテキストを返します。 val()が自分のオプションに何も返さないようにするには、必ずvalue=""を追加してください。

2
Gavin

このような選択のために

<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>

このようにしてIDを取得できます。

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

あるいは、代わりに値を使用して、それを簡単な方法で取得することもできます。

<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>

このような:

$('#list-name').val();
2
Geziel Carvalho

例を見てください。

    <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>
0
user2962280
 $(document ).ready(function() {
    $('select[name=selectorname]').change(function() { 
     alert($(this).val());});
 });
0
Turan Zamanlı

このコードは私には非常にうまくいきます。これは選択されたオプションの値を返します。 $( '#select_id')。find( 'option:selected')。val();

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

_または_

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

_または_

$('.class_nam').val();
0
Saddam Khan