jqueryで作成されたボタンはクリックに反応しません

Question

$（ '.whatever'）を使用するとわかりましたので、click（）は最初に作成されたアイテムに対してのみ機能します。追加の項目は正しい方法で応答しません。私は$（ '。何でも）.on（' click '、myFunction（））のようなものを使用するように指示されました。しかし、新しく作成されたアイテムは呼び出されないので、私は違いを検出していません。 http://jsfiddle.net/atrus6/zaKZN/

私の最初の入力に加えて「キル」は正しいやり方で動作します、しかし、追加の「入力+何もしないではありませんさんを殺す：

はここに私のコード例は、JSFiddleのデモンストレーションです。 .on（）を間違って使用していますか、それとも別のものですか？

Answer 1

試してみてください。

$('.rmv').live('click', function() { 
    console.log('here'); 
    $(this).parent().remove(); 
    return false; 
}); 

OR

$(document).on('click', '.rmv', function() { 
    console.log('here'); 
    $(this).parent().remove(); 
    return false; 
}); 

jsFiddle Demo

Answer 2

あなたがその結着を定義した後、それらが作成されるため、新しく作成された要素は、あなたのクリックハンドラに自動的にバインドされていません。 1つの解決策は、新しい要素が作成されたときにバインドすることです。

ここjsFiddle：http://jsfiddle.net/zaKZN/17/

$('.rmv').on('click', remove); 

$('.add').click(add); 

function remove() 
{ 
    console.log('here'); 
    $(this).parent().remove(); 
    return false; 
} 

function add() 
{ 
    var add = "<div class='input-append'>"; 
    add += "<input type='text' name='br'>"; 
    add += "<button class='btn btn-danger rmv'><i class='icon-minus'>Kill</i></button></div>"; 
    $(this).before(add); 

    //Bind newly created elements 
    $('.rmv').on('click', remove); 

    return false; 
} 

Answer 3

は（生き）は、あなたが動作するように（）に期待しているように見えるように動作しますが、推奨されません。

on（）は、on（）が呼び出されたときに存在する要素に対してのみ機能します。 しかし、 が新しく作成された要素の親となる要素にon（）をバインドし、セレクタを指定することでlive（）のように使用できます。

ので、例えば、

$('body').on('click', '.rmv', function() { 
    console.log('here'); 
    $(this).parent().remove(); 
    return false; 
});