jquery - jQuery 看不到点击附加对象

Question

我有这样的代码

$(document).ready(function(){
     $(".add").bind ('click',
        function ()
        {
            $('.main').append('<div class="add">Add element 2</div>');
        });
    });
</script>

<div class="main"><div class="add">Add element</div></div>

当虚拟对象“.add”附加到“.main”时，jquery 不会对点击它们做出反应

Answer 1

是的，因为您在创建新元素之前将操作绑定到仅现有的.add元素。

您需要使用作为on函数中的第二个参数提供的特定选择器将单击绑定到.main元素。

$('.main').on('click', '.add', function (){
    $('.main').append('<div class="add">Add element 2</div>');
});

这真的很直观。使用您的代码，您是说找到页面上的所有添加元素并将此函数绑定到每个元素。因此，稍后添加的将不会绑定此功能。

使用正确的代码，您是说找到主元素并将函数绑定到它，但仅在单击具有类 .add 的子元素时才执行该函数。

Answer 2

不要使用.bind()，而是使用.on()or，如果你有 jQuery 的 1.7 之前的版本，.delegate().

绑定是一次性操作，它不会监听 DOM 中的新项目。