0

OK、次のような jQuery がある場合:

$(document).ready(function(){
    $('#btn1').click(function(){
        //Add stuff to table
        $('#items_table tr:last').after('<tr><td><input type="button" id="btn2" value="second button" /></td>/tr>');
    });
    //Created button above is triggered
    $('#btn2').click(function(){
        alert('btn 2 was clicked');
    });
});

「btn2」をクリックしても何も起こりません。$(document).ready() のときにそこにないためだと思いますか?btn2 の js をテーブルの行に送信すると、正常に動作します。このようなもの:

$(document).ready(function(){
$('#btn1').click(function(){
    //Add stuff to table
    $('#items_table tr:last').after('<tr><td><input type="button" id="btn2" value="second button" /><script type="text/javascript ..... BLAH $(\'#btn\').click BLAH </script>;
    });
});

アイデア?

4

2 に答える 2

5

onを使用して、後で表示される可能性のある要素にテーブルがイベントを委譲できるようにします。

$('#items_table').on('click', '#btn2', function(){
    alert('btn 2 was clicked');
});
于 2013-03-08T17:04:52.563 に答える
0

.on()を使用してイベントハンドラーを親要素にアタッチし、セレクターを引数として渡します。これは、動的に追加された要素に対しても機能します...

 $('#items_table').on('click', '#btn2', function(){
    alert('btn 2 was clicked');
 });
于 2013-03-08T17:08:06.393 に答える