我想写一个函数来做一件简单的事情。我有 10 页数据,每页有 20 条记录。当用户转到第一页底部并单击加载更多时,我想加载第二页的数据并将这些数据附加到第一页的显示数据。
我发现了一个名为 infinitescroll 的 jquery 插件。它对我来说很好用,只是我不能附加更新的数据。
我的 html:
<html>
<head>
<script type="text/javascript" src="/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="/js/jquery.infinitescroll.js"></script>
<script type="text/javascript">
$(document).ready(function () {
console.log({
{
$p - > getCurrentPage()
}
});
var $container = $('#masonny-div');
$container.infinitescroll({
loading: {
msg: null,
msgText: "<em>Loading the next set of posts...</em>",
speed: 'fast',
},
navSelector: "#next",
nextSelector: "#next a",
itemSelector: "#masonny-div",
});
});
</script>
</head>
<body>
<div id='masonny-div'>
@foreach ($p as $x)
<div class="item">{{$x -> name}}</div>
@endforeach
</div>
<br>
<div id="next">
<a href="{{$p->getUrl($p->getCurrentPage() + 1)}}">Next</a>
</div>
</body>
</html>
这是下一页的链接:$p->getUrl($p->getCurrentPage() + 1
每次我点击它时,我都会得到下一页的数据,但是我如何将它附加到最后一页呢?
我尝试调用回调函数,但它不起作用。控制台没有消息。
var $container = $('#masonny-div');
$container.infinitescroll({
loading: {
msg: null,
msgText: "<em>Loading the next set of posts...</em>",
speed: 'fast',
},
navSelector: "#next",
nextSelector: "#next a",
itemSelector: "#masonny-div",
}, function(data){
console.log('I am here!');
console.log(data);
});
欢迎提供任何信息,谢谢。
最佳答案
关于javascript - jquery infinitescroll 如何追加数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19803209/