Question

我永远无法做到这一点 - 如何避免在对象上多次出现。例如，我有这个功能，您可以点击链接（转到顶部），然后文档将滚动到顶部。

this.scrollTop = function(){
    $('a[href=#top]').live('click',function(){
        alert('1');
        $('html, body').animate({scrollTop:0}, 'slow');
        return false;
    });
}

问题是我有一个ajax页面要加载到同一页面，而ajax页面还有另一个链接（转到顶部），所以我必须附加{{ 1}}在ajax调用之后再次运行。

当我查看提醒时，现有的链接（转到顶部）会出现两次 - 我该如何解决？

the scrolltop plugin。
the plugin加载ajax页面。
the live example。

如果单击左侧的第一个测试缩略图图像以加载ajax页面，则转到文档底部以单击转到顶部，然后您会看到它提醒两次或更多取决于你调用ajax页面的次数。

Answer 1

使用live时，您不必再附加处理程序了。来自documentation：

为所有与当前选择器匹配的元素附加处理程序，现在和将来。

放置

$('a[href=#top]').live('click',function(){
    $('html, body').animate({scrollTop:0}, 'slow');
    return false;
});

在主文件中。

事件处理程序附加到DOM的根目录。它会监听所有click个事件。只要单击与选择器（a[href=#top]）匹配的元素，就会执行处理程序。

Here is a very simplistic example。您将看到$('div').live(...)仅被称为一次，但将为您稍后添加的每个元素调用处理程序。

<强>更新

如何在文章中给出“go to top”链接一个不同的href？

$('a[href=#article]').live('click',function(){
    $('html, body').animate({scrollTop:100}, 'slow');
    return false;
});

并仅将#top用于主要版本。在这里你不必再使用live我想，你可以直接附加处理程序：

$('a[href=#top]').click(function(){
    $('html, body').animate({scrollTop:0}, 'slow');
    return false;
});

Answer 2

我在最后的$.ajax函数上使用它。在我的情况下失败，我使用500来延迟它并停止重发多次。

}).fail(function(response, status){
    alert("FAILED: "+JSON.stringify(response, null, 4));
},500);

我希望这可以帮到你！

Answer 3

在将函数附加到选择器的“click”事件类型之前，请使用unbind取消绑定以前的单击事件。以下是解除绑定的方法：

$(selector).unbind('click');

如何避免对象多次出现？

3 个答案: