gpt4 book ai didi

javascript - jquery infinitescroll 如何追加数据

转载 作者:塔克拉玛干 更新时间:2023-11-02 20:35:27 25 4
gpt4 key购买 nike

我想写一个函数来做一件简单的事情。我有 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);
});

欢迎提供任何信息,谢谢。

最佳答案

您使用的是最新版本吗?

https://github.com/paulirish/infinite-scroll

我认为有一个新的选择:

appendCallback: true

关于javascript - jquery infinitescroll 如何追加数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19803209/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com