无限阿贾克斯滚动分页循环分页、阿贾克斯
2023-09-11 22:32:11
作者：你不爱我、我不怪你
我使用ajax的无限滚动。这是工作中我可以点击装载更多的物品，这加载的内容。但是国际会计准则应停止在最后一页，并显示没有更多的职位，而是仍然显示加载更多的项目链接点击它时，再从第二页开始分页。
控制台：
欢迎在2页面，此页面的原始URL是：/网站/家庭/ 2
欢迎来到3页面，此页面的原始URL是：/网站/家用/ 3
IAS应显示有没有更多内容 - 而不是继续如下：
欢迎第4页，这一页的原始URL是：/网站/家庭/ 2
欢迎来到第5页，这一页的原始URL是：/网站/家用/ 3
攻速：
＆LT;脚本类型=文/ JavaScript的＆GT;
VAR IAS = $ .ias（{
集装箱：#posts
项目：.POST
分页：#pagination
接下来的。接下来一个
}）;
ias.extension（新IASSpinnerExtension（））;
ias.extension（新IASTriggerExtension（{偏移：1}））;
ias.extension（新IASNoneLeftExtension（{文字：有没有更多内容。}））;
。jQuery.ias（）扩展（新IASPagingExtension（））;
jQuery.ias（）。在（'pageChange'，功能（页次，scrollOffset，网址）{
的console.log（
欢迎页+页次+，+
此页面的原始URL将是：+网址
）;
}）;
＆LT; / SCRIPT＆GT;
我试图实施以下，这是行不通的：
如果（URL =='/网站/家庭/ 2'和;＆安培;页次＆GT; 2）{
。jQuery.ias（）destroy（）方法;
}
我使用分页从 http://www.phpeasystep.com/phptu/29.html
分页：
$ targetpage =home.php;
$上限= 10;
$页= $ _GET ['页'];
如果（$页）
$启动=（$页 - 1）* $限制;
其他
$开始= 0;
$ query2 = $ pdo-＆GT; prepare（从表中SELECT COUNT（*）的地方......）;
$ query2-＆GT;执行（阵列（'：身份证'=＆GT;的$ id））;
$ TOTAL_PAGES = $ query2-＆GT; fetchColumn（）;
如果（$页== 0）$页= 1;
$preV = $页 - 1;
$下一= $页+ 1;
$尾= CEIL（$ TOTAL_PAGES / $限制）;
$ LPM1 = $尾 - 1;
$分页=;
如果（$尾页→1）
{
$分页=＆LT; UL级= \分页\＆gt;中;
如果（$页→1）
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= $$ p $光伏\＆GT;？＆安培; LAQUO;＆所述; / a取代;＆其中; /李＆gt;中;
其他
$分页=＆LT;李类= \禁用\＆GT;＆LT; A HREF = \＃\＆GT;＆安培; LAQUO;＆LT; / A＆GT;＆LT; /李＆gt;中;
如果（$尾页7; +（$邻道* 2））
{
为（$计数器= 1; $反＆LT; = $尾; $反++）
{
如果（$反== $页）
$分页=＆LT;李类= \活动\＆GT;＆LT; A HREF = \＃\＆GT; $反＆LT;跨度类= \SR-仅\＆GT;（电流）LT; /跨度＆GT;＆所述; / a取代;＆所述; /利＆gt;中;
其他
$分页=＆所述;丽类= \下一个\＆GT;＆所述; A HREF = \$ targetpage页= $计数器\？＆GT; $计数器＆所述; / a取代;＆所述; /利＆gt;中;
}
}
ELSEIF（$尾→5 +（$邻道* 2））
{
如果（$页＆LT; 1 +（$邻道* 2））
{
为（$计数器= 1; $计数器4; +（$邻道* 2）; $计数器++）
{
如果（$反== $页）
$分页=＆LT;李类= \活动\＆GT;＆LT; A HREF = \＃\＆GT; $反＆LT;跨度类= \SR-仅\＆GT;（电流）LT; /跨度＆GT;＆所述; / a取代;＆所述; /利＆gt;中;
其他
$分页=＆所述;丽类= \下一个\＆GT;＆所述; A HREF = \$ targetpage页= $计数器\？＆GT; $计数器＆所述; / a取代;＆所述; /利＆gt;中;
}
$分页=。
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= $ LPM1 \？＆GT; $ LPM1＆所述; / a取代;＆所述; /利＆gt;中;
$分页=＆LT;李类= \下一步\＆GT;＆LT; A HREF = \$ targetpage页= $尾\？＆GT; $尾＆LT; / A＆GT;＆LT; /李＆gt;中;
}
ELSEIF（$尾 - （$邻道* 2）＆GT; $页和放大器;＆安培; $页＆GT;（$邻道* 2））
{
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= 1 \？→1＆其中; / a取代;＆所述; /利＆gt;中;
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= 2 \？→2＆所述; / a取代;＆所述; /利＆gt;中;
$分页=。
为（$计数器= $页 - $邻道; $反＆LT; = $页+ $邻道; $反++）
{
如果（$反== $页）
$分页=＆LT;李类= \活动\＆GT;＆LT; A HREF = \＃\＆GT; $反＆LT;跨度类= \SR-仅\＆GT;（电流）LT; /跨度＆GT;＆所述; / a取代;＆所述; /利＆gt;中;
其他
$分页=＆所述;丽类= \下一个\＆GT;＆所述; A HREF = \$ targetpage页= $计数器\？＆GT; $计数器＆所述; / a取代;＆所述; /利＆gt;中;
}
$分页=。
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= $ LPM1 \？＆GT; $ LPM1＆所述; / a取代;＆所述; /利＆gt;中;
$分页=＆LT;李类= \下一步\＆GT;＆LT; A HREF = \$ targetpage页= $尾\？＆GT; $尾＆LT; / A＆GT;＆LT; /李＆gt;中;
}
其他
{
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= 1 \？→1＆其中; / a取代;＆所述; /利＆gt;中;
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= 2 \？→2＆所述; / a取代;＆所述; /利＆gt;中;
$分页=。
为（$计数器= $尾 - （2 +（$邻道* 2））; $反＆LT; = $尾; $反++）
{
如果（$反== $页）
$分页=＆LT;李类= \活动\＆GT;＆LT; A HREF = \＃\＆GT; $反＆LT;跨度类= \SR-仅\＆GT;（电流）LT; /跨度＆GT;＆所述; / a取代;＆所述; /利＆gt;中;
其他
$分页=＆所述;丽类= \下一个\＆GT;＆所述; A HREF = \$ targetpage页= $计数器\？＆GT; $计数器＆所述; / a取代;＆所述; /利＆gt;中;
}
}
}
如果（$页＆LT; $计数 - 1）
$分页=＆其中;丽类= \。下一个\＆GT;＆所述; A HREF = \$ targetpage页= $下\？＆GT;＆安培; RAQUO;＆所述; / a取代;＆所述; /利＆gt;中;
其他
$分页=＆LT;李类= \禁用\＆GT;＆LT; A HREF = \＃\＆GT;＆安培; RAQUO;＆LT; / A＆GT;＆LT; /李＆gt;中;
$分页=＆LT; / UL＆GT; \ N的;
}
解决方案
请尝试加入多一个事件处理程序的无限阿贾克斯滚动如下：
jQuery.ias.on（noneLeft'，函数（）{
的console.log（我们见底！）;
}）;
和看看这是越来越打印或不在浏览器控制台。如果没有得到印，那么你有一个问题，您的分页链接。交叉验证。检查你的HTML与萤火虫，并检查是否有如何产生的或无效的链接。
如果您的分页是正确的，如果你看到上面的 noneLeft 事件然后尝试使用下面的code停止滚动：
页次= 0;
jQuery.ias.on（'下一步'，函数（URL）{
如果（url.indexOf（/网站/家庭/ 2）＆GT; -1放大器;＆安培;页次＆GT; 2）{
返回false;
}
其他{
页次++;
}
}）
I am using infinite ajax scroll. It is working as in I can click load more items and this loads the content. However ias should stop at the last page and show 'There are no more posts', instead it still shows the 'load more items' link which when clicked starts the pagination again from page 2.
console:
Welcome at page 2, the original url of this page would be: /website/home/2
Welcome at page 3, the original url of this page would be: /website/home/3
ias should display 'There are no more posts' - instead it continues as below:
Welcome at page 4, the original url of this page would be: /website/home/2
Welcome at page 5, the original url of this page would be: /website/home/3
ias:
<script type="text/javascript">
var ias = $.ias({
container: "#posts",
item: ".post",
pagination: "#pagination",
next: ".next a"
});
ias.extension(new IASSpinnerExtension());
ias.extension(new IASTriggerExtension({offset: 1}));
ias.extension(new IASNoneLeftExtension({text: 'There are no more posts.'}));
jQuery.ias().extension(new IASPagingExtension());
jQuery.ias().on('pageChange', function(pageNum, scrollOffset, url) {
console.log(
"Welcome at page " + pageNum + ", " +
"the original url of this page would be: " + url
);
});
</script>
I have tried to implement the below, it does not work:
if(url == '/website/home/2' && pageNum > 2) {
jQuery.ias().destroy();
}
I am using pagination from http://www.phpeasystep.com/phptu/29.html
pagination:
$targetpage = "home.php";
$limit = 10;
$page = $_GET['page'];
if($page)
$start = ($page - 1) * $limit;
else
$start = 0;
$query2 = $pdo->prepare("select count(*) from table where...");
$query2->execute(array(':id' => $id));
$total_pages = $query2->fetchColumn();
if ($page == 0) $page = 1;
$prev = $page - 1;
$next = $page + 1;
$lastpage = ceil($total_pages/$limit);
$lpm1 = $lastpage - 1;
$pagination = "";
if($lastpage > 1)
{
$pagination .= "<ul class=\"pagination\">";
if ($page > 1)
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$prev\">«</a></li>";
else
$pagination.= "<li class=\"disabled\"><a href=\"#\">«</a></li>";
if ($lastpage < 7 + ($adjacents * 2))
{
for ($counter = 1; $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>";
else
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";
}
}
elseif($lastpage > 5 + ($adjacents * 2))
{
if($page < 1 + ($adjacents * 2))
{
for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++)
{
if ($counter == $page)
$pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>";
else
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";
}
$pagination.= "";
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lpm1\">$lpm1</a></li>";
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lastpage\">$lastpage</a></li>";
}
elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2))
{
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=1\">1</a></li>";
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=2\">2</a></li>";
$pagination.= "";
for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++)
{
if ($counter == $page)
$pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>";
else
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";
}
$pagination.= "";
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lpm1\">$lpm1</a></li>";
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lastpage\">$lastpage</a></li>";
}
else
{
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=1\">1</a></li>";
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=2\">2</a></li>";
$pagination.= "";
for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>";
else
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";
}
}
}
if ($page < $counter - 1)
$pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$next\">»</a></li>";
else
$pagination.= "<li class=\"disabled\"><a href=\"#\">»</a></li>";
$pagination.= "</ul>\n";
}
解决方案
Please try adding one more event handler for infinite ajax scroll as follows:
jQuery.ias.on('noneLeft', function() {
console.log('We hit the bottom!');
});
And see if this is getting printed or not in browser console. If this is not getting printed then you have a problem with your pagination links. Cross verify that. Inspect your HTML with firebug and check whether valid links are getting generated or not.
If your pagination is correct and if you are seeing above noneLeft event then try using following code to stop scrolling:
pageNum = 0;
jQuery.ias.on('next', function(url) {
if (url.indexOf("/website/home/2") > -1 && pageNum > 2) {
return false;
}
else{
pageNum++;
}
})
相关推荐
猜您喜欢
精彩图集
