web-dev-qa-db-ja.com

HTML <select> on selectイベントの名前は何ですか？

HTMLの「select」要素にはon selectイベントがありますか？イベントの名前は正確に何ですか？

javascriptjqueryhtmlhtml-select
39
Julius A

onchange は何を探していますか？

61
Jonny Buchanan

選択範囲が変更されない場合、これは起動しないことにも言及する価値があります（自明のようです）。私が知る限り、ユーザーが選択ボックスをドロップダウンしてから元の値を再選択したときに発生するイベントはありません。

25
Wakeless

onchange Event です。

jQueryは_.change_ヘルパーでラップします。プレーンなJavascriptを使用する場合は、addEventListner('change', function...)を使用します。

_<html>
<head>
    <script type="text/javascript" src="jquery-1.2.6.js"></script>
    <script type="text/javascript">

// If using jQuery
$(document).ready( function() {
    $("#list").attr( "selectedIndex", -1 );
    $("#list").change( function() {
        $("#answer").text( $("#list option:selected").val() );
    });
});
    </script>

    <script type="text/javascript">

// Plain Javascript:
document.addEventListener('DOMContentLoaded', function(event) {
    var selectList = document.getElementById("list");
    var divAnswer  = document.getElementById("answer");
    selectList.addEventListener("change", function(changeEvent) {
        divAnswer.textContent = selectList.value;
    });
});
    </script>

</head>
<body>
    <div id="answer">No answer</div>
    <form>
        Answer
        <select id="list">
            <option value="Answer A">A</option>
            <option value="Answer B">B</option>
            <option value="Answer C">C</option>
        </select>
    </form>
</body>
</html>
_
20
Alexander Prokofyev

入力タイプに関係なく、フォーム入力が値を変更するたびに、onchangeイベントが常にスローされます。 （ボタンは例外で、実際には入力デバイスではありません。）

3
Ryan McCue