jScroll 无限滚动的 jQuery 插件
jScroll 是一个用于无限滚动的 jQuery 插件，当滚动到底部就触发预定义的一个点击事件加载下一页，是在当前页面或内容区域滚动时通过 Ajax 加载内容的能力。新内容可以在每次滚动到现有内容的末尾时自动加载，也可以通过单击现有内容末尾的导航链接来触发加载。
安装
依赖性
jScroll 需要 jQuery v1.8.0 或更高版本。
CDN
Unpkg
将脚本包含在 unpkg 具有指定的版本号，其中 #.#.# 表示版本。
<script src="//unpkg.com/jscroll@#.#.#/dist/jquery.jscroll.min.js"></script>或者，您可以省略 Version 标记来加载最新发布的版本。
<script src="//unpkg.com/jscroll/dist/jquery.jscroll.min.js"></script>CDNJS
将脚本包含在 CNDJS 有指定的版本号，其中 #.#.# 表示版本。
<script src="https://cdnjs.cloudflare.com/ajax/libs/jscroll/#.#.#/jquery.jscroll.min.js"></script>包管理器
NPM
$ npm install jscroll --saveYarn
$ yarn add jscrollBower
$ bower install jscroll --save使用
初始化
这个 jscroll 方法在选择器上调用，其中包含可滚动内容。始终确保在初始化 jScroll 之前已经在 DOM 中呈现了要调用 jScroll 的内容，初始化jScroll DOMContentLoaded 活动：
$(function() { $('.jscroll').jscroll();
});
定制化
这个 jscroll 方法将可选对象文字作为重写默认选项的参数。下面是如何做到这一点的一个例子。
var options = { loadingHtml: '<img src="loading.gif" alt="Loading" /> Loading...',
padding: 20,
nextSelector: 'a.jscroll-next:last',
contentSelector: 'li'
};
$('.jscroll').jscroll(options);
看见配置所有选项的列表。
配置
debug
- 类型：
Boolean - 违约：
false
当设置为 true，则将有用信息输出到控制台显示，如果 console 对象存在。
autoTrigger
- 类型：
Boolean - 违约：
true
当设置为 true，当用户滚动到包含元素的底部时，将自动触发下一组内容的加载。当设置为false，所需的下一个链接将在单击时触发下一组内容的加载。
autoTriggerUntil
- 类型：
Boolean|Number - 违约：
false
设置为大于0关掉autoTrigger在指定的页数之后分页。要求autoTrigger成为true.
loadingHtml
- 类型：
String - 违约：
<small>Loading...</small>
在加载下一组内容时显示在内容底部的HTML。
loadingFunction
- 类型：
Function|Boolean - 违约：
false
后面运行的JavaScript函数。loadingHtml 已经画出来了。
padding
- 类型：
Number - 违约：
0
与可滚动内容底部的距离，在此位置触发下一组内容的加载。这只在下列情况下才适用autoTrigger设置为true.
nextSelector
- 类型：
String - 违约：
a:last
用于查找包含href指向下一组内容。如果找不到此选择器，或者如果它不包含href属性时，jScroll将从调用它的元素中自行销毁和解除绑定。
contentSelector
- 类型：
String - 违约：
''
仅在下一组内容的响应中加载部分内容的方便选择器。如果为空，则忽略此选择器，并将整个响应应用于DOM。
更多信息：contentSelector选项及其加载响应片段的方式，请参阅 .load() 方法的 jQuery 文档.
pagingSelector
- 类型：
String - 违约：
''
还可以为分页控件定义选择器，以便隐藏它们，而不只是隐藏下一个页面链接。
callback
- 类型：
Function|Boolean - 违约：
false
还可以定义在加载了一组内容之后调用的回调函数。
相关链接
- Github：https://github.com/pklauzinski/jscroll
- 官网：https://jscroll.com
以上是 jScroll 无限滚动的 jQuery 插件 的全部内容， 来源链接： utcz.com/p/232582.html
