找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 298|回复: 0

jQuery无限加载(实时加载、不刷新页面)

[复制链接]
已绑定手机

3308

主题

1469

回帖

4787

积分

管理员

积分
4787
发表于 2020-8-19 16:49:30 | 显示全部楼层 |阅读模式

马上注册,免费下载更多dz插件网资源。

您需要 登录 才可以下载或查看,没有账号?立即注册

×
利用的是 jquery.ias.min.js 封包插件。
这个插件和已往发布的翻页、点击加载不同之处在于,这个插件并非是伪加载。而是根据滚动条与页底的距离实时载入数据。
也可以理解成:将本是第二页的内容在不刷新页面的情况下当滚动条达到页底距离时,继续往下载入。
  1. <script type="text/javascript">    var ias = jQuery.ias({        container: ".footslist", //包含所有文章的元素        item: ".footprints", //文章元素        pagination: ".pg", //分页元素        next: ".pg a.nxt", //下一页元素    });    ias.extension(new IASTriggerExtension({        text: '<p>查看更多阅读记录</p>', //此选项为需要点击时的文字        offset: 3, //设置此项后,到 offset+1 页之后需要手动点击才能加载,取消此项则一直为无限加载    }));    ias.extension(new IASSpinnerExtension());    ias.extension(new IASNoneLeftExtension({        text: '<div class="mtw">没有更多了</div>', // 加载完成时的提示    }));    ias.extension(new IASSpinnerExtension());    ias.extension(new IASPagingExtension());    ias.extension(new IASHistoryExtension()); </script>
复制代码
须要注意的几个地方:
一。封包插件会自动为 pagination: ".pg",添加:style="display: none;"
二。如果不需要手动点击,直接删除 offset: 3,
三。如果不需要地址栏自动添加翻页地址,删除如下三行
    ias.extension(new IASSpinnerExtension());
    ias.extension(new IASPagingExtension());
    ias.extension(new IASHistoryExtension());
<
一花一世界,一叶一追寻。一曲一场叹,一生为一人。
 懒得打字嘛,点击右侧快捷回复【查看最新发布】   【应用商城享更多资源】
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

联系DZ插件网微信客服|最近更新|Archiver|手机版|小黑屋|DZ插件网! ( 鄂ICP备20010621号-1 ) |网站地图

您的IP:44.192.79.149,GMT+8, 2023-5-31 05:28 , Processed in 0.132411 second(s), 64 queries , Gzip On, Redis On.

Powered by Discuz! X3.5 Licensed

© 2001-2023 Discuz! Team.

点击联系客服QQ
扫码联系客服微信