2

私が構築している JQM (1.3.0) アプリでは、「on」を使用してすべての送信ボタンをクリック イベントにバインドし、現在および将来のすべての送信ボタンにこのイベントがバインドされるようにします。$(document).ready() でこれらのバインディングを行っているのは、1 回だけ呼び出す必要があると考えているためです。

JQMパネルをいくつかのコンテンツで更新し、そのコンテンツで .trigger('create') を呼び出します。何が起こるかというと、新しく作成された送信ボタンがクリックされたときにバインドされたクリックイベントをトリガーする必要がありますが、そうではありません。

これは、私が達成しようとしていることを示すフィドルです。デモでは、送信ボタンをクリックするたびにメッセージ ボックスに「クリック済み」と表示されるはずですが、残念ながら、これは最初の要素でのみ発生します。

$(function(){
    $('input[type="submit"]').on('click', function(e){
        $('#msg').append('<div>Clicked</div>');
        $('#panel').html('<input type="submit" value="New Button">').trigger('create');
    });
});

ここで .on() を間違って使用していますか? すべてのバインディングを関数に詰め込み、 .trigger('create') が呼び出されるたびにその関数を呼び出すことができると思います...しかし、それは非効率的です。

4

2 に答える 2

3

あなたが必要です

$('#someParentElement').on('click', 'input[type="submit"]', function(e){
   //handler
});

あなたがそれを持っていた方法は古いものと同等でした

$('input[type="submit"]').bind('click', function(e){
   //handler
});
于 2013-02-15T01:26:32.667 に答える
2

.onメソッドを使用してイベントをバインドする方法は2つあります。1つは、イベントをより高いレベルの要素にバインドするように機能するイベント委任を使用することです（document必要に応じて、より近い方が良いです）。その後、イベントが発生すると、イベントをリッスンし、渡されたセレクターと一致するかどうかを確認します。発砲します。使用する2番目の方法.onは、委任を使用せずに要素に直接バインドすることです。

2番目のバージョンの.on方法を使用していますが、必要なのは最初のバージョン（委任バージョン）を使用することです。

たとえば、現在のコードの代わりに、次のようなことを行います

$(function(){
    $('#someParentElement').on('click','input[type="submit"]', function(e){
        $('#msg').append('<div>Clicked</div>');
        $('#panel').html('<input type="submit" value="New Button">').trigger('create');
    });
});
于 2013-02-15T01:29:40.453 に答える