jqueryを使用して2つの選択されたオプションの値を取得する方法は？

Question

私は、次の選択オプションがあります。

<select id="optionA"> 
<option> A </option> 
<option> B </option> 
<option> C </option> 
</select> 

<select id="optionB"> 
<option> D </option> 
<option> E </option> 
<option> F </option> 
</select> 

次のjQueryコードは、選択した各オプションのテキスト値を決定するために動作していない：

<script type="text/javascript"> 
    $(document).ready(function() 
     { 
      if($("#optionA").change() || ($("#optionB").change()) 
      { 
       var textA = $(this).find("#optionA option:selected").text(); 
       var textB = $(this).find("#optionB option:selected").text(); 
       alert(+ textA + " " + textB); 
      } 
     }); 
</script> 

問題になるかもしれないものの任意のアイデアを？

Answer 1

$('#optionA, #optionB').change(function() 
{ 
    alert($('#optionA').val() + ' ' + $('#optionB').val()); 
}); 

http://jsfiddle.net/upZKt/1/

Answer 2

あなたはこのようなあなたのイベントハンドラを記述する必要があります。

$("#optionA,#optionB").change(function() { 
    var textA = $("#optionA").val(); 
    var textB = $("#optionB").val(); 
    alert(+ textA + " " + textB); 
}); 

Answer 3

change()は、イベントハンドラ変更イベントが発生すると、コールバック関数をとります。

blockのコードをコールバック関数に移動する必要があります。 注：セレクタとロジックを凝縮して、jQueryスタイルをさらに活用しました。

$("#optionA, #optionB").change(function() { 
    var textA = $("#optionA").val(); 
    var textB = $("#optionB").val(); 
    alert(textA + " " + textB); 
}); 

は、アクションでそれを参照してください - http://jsfiddle.net/G4Lpm/1/

Answer 4

私は次のことをお勧めしたい：

<select id="optionA"> 
    <option value="A"> A </option> 
    <option value="B"> B </option> 
    <option value="C"> C </option> 
</select> 

<select id="optionB"> 
    <option value="D"> D </option> 
    <option value="E"> E </option> 
    <option value="F"> F </option> 
</select> 

<script type="text/javascript"> 
    function selectChanged() { 
     var textA = $("#optionA").val(); 
     var textB = $("#optionB").val(); 
     alert(textA + " " + textB); 
    } 

    $(document).ready(function() { 
     $("#optionA,#optionB").change(selectChanged); 
    }); 
</script> 

例：http://jsfiddle.net/crnrY/