12

.on()HTMLがまだ生成されていない場合、どのように使用しますか？jQueryページには

新しいHTMLがページに挿入されている場合は、要素を選択し、新しいHTMLがページに配置された後にイベントハンドラーをアタッチします。

しかし、私はそれをどのように行うのか本当にわかりません。イベントハンドラーを「リロード」する方法はありますか？

だから私が持っていたら

$(document).ready(function(){
    $('.test').on('click', function(){
        var id = $(this).attr('id');
        console.log("clicked" + id);
    });
generatePage();
});

generatePage（）がでdivの束を作成する.test場合、どのように再バインドし.on()ますか？

同様の質問が寄せられていることは承知していますが、すばやく検索しても探しているものが見つかりませんでした。

4

1 に答える 1

22

以下の例のように .on を使用します。body タグは常に利用可能であると想定できるため、イベント ハンドラーを body にアタッチし、イベントをセレクター (この場合は.test ) にデリゲートしても安全です。

$(document).ready(function(){
    $('body').on('click', '.test', function(){ // Make your changes here
        var id = $(this).attr('id');
        console.log("clicked" + id);
    });

    generatePage();
});

または、generatePage()が html も生成している場合、head タグと body タグはドキュメントをセレクターとして使用します。

$(document).ready(function(){
    $(document).on('click', '.test', function(){ // Make your changes here
        var id = $(this).attr('id');
        console.log("clicked" + id);
    });

    generatePage();
});

jquery のドキュメントによると、.on は次のパラメータを受け入れます。

.on( events [, selector] [, data], handler(eventObject) )

セレクターを含めると、次のように記述されます。

セレクターが提供されている場合、イベント ハンドラーは委任されていると見なされます。イベントがバインドされた要素で直接発生した場合、ハンドラーは呼び出されませんが、セレクターに一致する子孫 (内部要素) に対してのみ呼び出されます。jQuery は、イベント ターゲットからハンドラーがアタッチされている要素 (つまり、最も内側の要素から最も外側の要素) までイベントをバブルし、セレクターに一致するそのパスに沿ったすべての要素に対してハンドラーを実行します。

于 2012-04-29T11:26:12.317 に答える