Question

我正在构建一个jQuery Mobile网站以供将来与PhoneGap一起使用，所以我的所有内容都是通过AJAX加载来从远程PHP / MySQL中提取数据

在主页中，我最初只加载前10个新闻;然后，使用“更多...”按钮，我加载下一个10，依此类推'直到所有记录都从数据库中提取

http://www.media-italia.eu/app/index2.html

点击新闻并返回“返回”按钮恢复初始状态（前10个项目已加载）。没关系，到目前为止还不错。

现在出现了棘手的部分：我想在我的页面上进行“无限滚动”，所以我利用了jQuery Waypoints插件，这就是结果：

http://www.media-italia.eu/app/index.html

一切似乎都很好，但这里有一个奇怪的事情（请打开控制台看）
当我点击新闻，然后返回并滚动时，PHP页面被调用两次，从而产生重复的项目

我尝试了一些事情（包括在.on（）之前使用.off（）），但根本没有运气真的不知道问题可能是什么，请帮忙吗？

我还准备了一个可下载的脚本：http://www.media-italia.eu/app/app.rar

提前谢谢!!!

Answer 1

解决方案来自插件作者：我必须销毁并重新创建航点，所以：

$('#home .content').waypoint(function(direction) {
    if (direction === 'down'){
        $('#next').trigger('click');
    }
}, { offset: 'bottom-in-view' });

变成这个：

$('#home .content').waypoint('destroy');
$('#home .content').waypoint(function(direction) {
    if (direction === 'down'){
        $('#next').trigger('click');
    }
}, { offset: 'bottom-in-view' });

无限滚动（Waypoints）与jQuery Mobile，Back按钮和远程脚本调用两次

1 个答案: