附加后,活动绑定不起作用

Question

任何人都可以解释我为什么当我添加偶数个方块时,绑定事件将不再起作用？

$("#add").click(function(){
    $("#container").append("<div class=\"square\">xxxxxx</div> ").bind("click",function(e) {
            $(e.target).toggleClass( "change" );
        });
    });

http://jsfiddle.net/8W4JB/

Answer 1

使用事件委派.

写:

$("#add").click(function () {
    $("#container").append("<div class=\"square\">xxxxxx</div> ");
});
$("#container").on("click", ".square", function (e) {
    $(this).toggleClass("change");
});

这里更新了小提琴.

更多信息在这里.