2

ボタンクリックイベントを通じてドロップダウンボックスを1つ生成します。このドロップダウンでは onchange イベントは発生しません。なぜこれが盛り上がっているのか、誰か助けてもらえますか？コードは以下です

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function($) {

        $('#pin').click(function() {
            var content='<select class="pincode"><option value="1">1</option><option value="2">2</option></select>';
            $("#test").append(content);

            });
        $(".pincode").change(function(){
            alert($(this).val());
        });     
        });
    </script>
    <style type="text/css">
        div {
            padding: 35px;
            float: left;
        }
        }
    </style>
    <title>New Web Project</title>
</head>
<body>
    <h1>Dynamic Drop Down using jQuery</h1>
    <div>
        <select class="pincode">
            <option value="1">1</option>
            <option value="2">2</option>
        </select>
    </div>

    <div id="test"></div>
    <input type="button" id="pin" value="pin" />
4

2 に答える 2

16

要素は動的に読み込まれ、イベント リスナーが作成されたときには存在しなかったため、委任を使用する必要があります。

$(document).on('change',".pincode", function(){
    alert(this.value);
});

}style タグ内に余分なものがあることに注意してください。これを CSS ファイルに含めたほうがよいでしょう。

デモはこちら

.on()に関するこのリンクを確認してください。委任されたイベントの部分では、次のように読むことができます:

イベント ハンドラーは、現在選択されている要素にのみバインドされます。これらは、コードが「イベント ハンドラー」を呼び出す時点でページに存在している必要があります。

于 2013-10-20T19:28:45.557 に答える
1

動的に作成された要素では、「on」と「off」を使用してイベントをバインドすることをお勧めします

$(".pincode").on("change", function(){
            alert($(this).val());});
于 2013-10-20T19:43:06.733 に答える