介绍
jquery-jscroll 是一款对 jQuery 插件的增强，它可以让网页内容自动加载更多，可以实现类似于当用户滑到页面底部时，网页自动加载更多内容的功能。本教程将介绍 jquery-jscroll 的安装和使用。
安装
在使用 jquery-jscroll 之前，需要先安装 jQuery。如果您已安装 jQuery，可以通过以下命令来安装 jquery-jscroll：
npm install jquery-jscroll --save
使用
使用 jquery-jscroll，需要引入如下文件：
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script src="https://cdn.jsdelivr.net/jquery.jscroll/2.4.1/jquery.jscroll.min.js"></script>
然后通过下面的方式来启动 jquery-jscroll：
-- -------------------- ---- -------
-------------
----------------------
------------ ----- ---------------------- ------------- -- ------------
-------- ---
------------- -----------------
---------------- -----
--------- ---------- -
---------- ------- ----------
-
---
---以上代码中，.scroll 是你想要自动滚动加载的内容的选择器，loadingHtml 是加载时的提示内容，padding 是距离底部多少距离开始加载下一页，nextSelector 是下一页的选择器，contentSelector 是每一页内容的选择器，callback 是当新内容加载完毕时的回调函数。
示例
下面是一个简单的示例，它可以显示一组照片，用户每次滚动到页面底部时，会加载更多的照片。在这个示例中，我们使用了 Unsplash 的 API 来获取照片。
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------- ------- ------------
------- -----------------------------------------------------------
------- -----------------------------------------------------------------------------------
-------
------
---- ----------- ---------------
------
--------
-------------
--- ---- - --
--- --- - ------------------------------------------------------------------ - -----
-------- ------------ -
---------------------- -----
-------------- -------------- -
------------------
------------ --------------- ------ -
--- ---- - ------- -
----- ------ - ---------------- - -- ------ - ----------------- - ---- -
---------
--------------------------
---
--- - ------------------
---
-
-------------
----------------------
------------ ----- ---------------------- ------------- -- ------------
-------- ---
------------- --------------
---------------- -------- -----
--------- ---------- -
-------
--- - ------------------------------------------------------------------ - -----
-------------
-
---
---
---------
-------
-------在你的项目中引入以上代码，用你的 Access key 替换 YOUR_ACCESS_KEY。这个示例会自动加载 Unsplash 的照片。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005601a81e8991b448de442