javascript - HTMLコントロールのjavascriptで選択されたインデックス変更イベント

Question

HTML コントロールがあります。

<select id="grade">

選択したインデックス変更イベントでドロップダウンの選択した値を取得したい。

ドロップダウン選択の変更時に呼び出される次のコードを追加しようとしましたが、機能しないようです。他の提案はありますか？

$("#grade").on('change', function() { 
alert("hi"); 
});

また、Java Script で選択した値を取得するにはどうすればよいですか。

Answer 1

jQueryを必要としない人のための代替手段は次のとおりです。

<select id="grade" onchange="OnGradeChanged(this.value);">
     <option value="1">1</option>
     <option value="2">2</option>
</select>
<script>
function OnGradeChanged(value){
     alert(value);
}
</script>

Answer 2

コードの実行時に ID=grade が存在しない場合は、ハンドラーをページ内の永続的なアセットに委任する必要があります。これは、要素または本文またはドキュメント自体からツリーを上った任意の要素セレクターにすることができます。このメソッドは、セレクターが既に存在するか、将来存在するかに関係なく機能します

$(document).on('change',"#grade", function() { 
     alert( $(this).val())
});

ID が存在する場合、コードをラップしている限り、コードは機能するはずです。*document.ready*

$(function(){
/* your code*/

})

Answer 3

あなたも試すことができます：

$(document).ready(function(){
  $('#grade').change(function() {
    alert('Handler for .change() called.');
    alert($(this).val()); 
  });
});