2009-08-04 27 views
18

複数の選択オプションを使用して値とテキストを取得することができるかどうかは疑問でした(選択されている場合は値とテキストを取得し、値とテキストなど)jqueryで複数選択オプションを反復処理する方法

1つのページに15の選択ボックスがありますか?

助けていただければ幸いです。

<form> 
     <select class="select" name="select3" id="select3"> 
      <option value="0">0</option> 
      <option value="1.99">1</option> 
      <option value="1.99">2</option> 
      <option value="1.99">3</option> 
      <option value="1.99">4</option> 
      <option value="1.99">5</option> 
      <option value="1.99">6</option> 
      <option value="1.99">7</option> 
      <option value="1.99">8</option> 
     </select> 
     </form> 

    <form> 
     <select class="select" name="select" id="select"> 
      <option value="0">0</option> 
      <option value="1.99">1</option> 
      <option value="1.99">2</option> 
      <option value="1.99">3</option> 
      <option value="1.99">4</option> 
      <option value="1.99">5</option> 
      <option value="1.99">6</option> 
      <option value="1.99">7</option> 
      <option value="1.99">8</option> 
      </select> 
    </form> 

すべての選択オプションは同じクラスです。

おかげ

答えて

40

これは警告が表示されます選択したすべてのオプションテキストと値(ページ上のすべての選択のための):

$('select > option:selected').each(function() { 
    alert($(this).text() + ' ' + $(this).val()); 
}); 

参照コア/各セレクタ/選択:

http://docs.jquery.com/Core/each

http://docs.jquery.com/Selectors/selected

+0

は、それはすべきではない:$( '#>を選択... – jon

+0

そのクラス、名前、IDとタグがすべて同じである不明確ユースケース、 $( 'select> ...、$('#select> ...、$(。select ...)はすべて動作します –

3

この関数は、指定されたクラスに一致する選択肢のテキスト/値のペアの配列を返します。

function getSelects(klass) { 
    var selected = []; 
    $('select.' + klass).children('option:selected').each(function() { 
     var $this = $(this); 
     selected.push({ text: $this.text(), value: $this.val() }); 
    }); 
    return selected; 
} 
0
//Another option 

var selected = []; 

$('select :has(:selected)').each(function(){ 

    var $this = $(this); 
    selected.push({ text: $this.text(), value: $this.val()); 

}); 

return selected; 
2

あなたのセレクトボックスのすべてが同様のID( "select_1"、 "select_2"、 "select_3" など)で開始した場合、あなただけ行うことができます。

var arr = []; 
$("select[id^='select_']").children('option:selected').each(function(){ 
    //you will do this once for every selected item... 
} 

この複数のグループ化がある場合に備えて、特定の選択ボックスのみをループすることができます。 optgroupsため

+0

返信ありがとうございます。上記のコードで.change関数も使用できますか? 、 ....のように.change.each(function(){ – amir

+0

匿名関数で変更をラップするといいですか? .change(function(){ $( 'select')。各..... }); – redsquare

6

...

$("select[id^='desu']").children('optgroup').children('option:selected').each( 
    function(id, element) { 
     document.write(element.title); 
    } 
); 
+0

ありがとう、このモンタナ! –

+0

aha the children()function - ちょうど私が探していたもの! –

関連する問題