2012-01-13 14 views
5

どのようにjQueryを使用してコンボボックスから選択されたテキスト値を取得できますか?コンボボックスの名前でjQueryを使用してコンボボックスの選択テキストを取得しますか?

私はコンボボックスの「名前」しか持っていません。

したがって、という名前のというコンボボックスのIDを使用して、選択したアイテムのテキストが必要です。

私が午前は、

var selected_fld = ($(this).attr('name')); 

にはどうすればさらに進めることができますか?

答えて

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

または

$('select[name=nameOfTheBox] option:selected').val(); 

$('select[name=nameOfTheBox] option:selected').text(); 

はあなたにこれを取得するには、以下で簡単に行うことができます

+1

+1を "再生" に戻ります私にそれを打つ。自分自身の答えを削除する –

7

そのテキストを与えるあなたの選択したオプションの値を与えます実際のテキスト値...

以下のHTMLを210
var value = $("[name='MyName'] option:selected").text(); 

またはこのオプション「値」属性を取得するには...

var value = $("[name='MyName']").val(); 

、最初はあなたを与えるだろう「のMyText」、第二はあなたを与えるだろう「MyValue」

<select name="MyName"> 
    <option value="MyValue" selected="selected">MyText</option> 
</select> 

Here is a working example

1

試し以下

<select name="name1"> 
     <option value="val1">val1</option> 
     <option value = "val2">val2</option> 
</select> 

var text = $("select[name='name1'] option:selected").text(); 
+0

'selected'の後の一重引用符は二重引用符でなければなりません – Connum

+0

@Connumは間違って入力しています –

0
<select id ="myCombo"> 
    <option value="Play selected="selected">Here</option> 
    <option value="Once">Again</option> 
</select> 

$('#myCombo option:selected').text(); 

これは "ここ"

$('myCombo option:selected').val(); 

を戻りますこれは

0
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script src="jquery-3.1.0.js"></script> 
    <script> 
     $(function() { 
      $('#selectnumber').change(function(){ 
       alert('.val() = ' + $('#selectnumber').val() + ' AND html() = ' + $('#selectnumber option:selected').html() + ' AND .text() = ' + $('#selectnumber option:selected').text()); 
      }) 
     }); 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <select id="selectnumber"> 
      <option value="1">one</option> 
      <option value="2">two</option> 
      <option value="3">three</option> 
      <option value="4">four</option> 
     </select> 

    </div> 
    </form> 
</body> 
</html> 

Click to See OutPut Screen

おかげで... :)

関連する問題