Infinite Ajax Scroll, or ias for short, is a jQuery scrolling ajax paging plug-in. When the page scrolls to the visible part of the container, the data will be loaded asynchronously and automatically.

The integration of plug-ins is very simple, including the following steps:

1. jquery.js and jquery-ias.min.js are referenced in the page

<script src='http://www.dedediy.com/js/jquery.js?ver=1.11.0'></script>
<script src="http://www.dedediy.com/js/jquery-ias.min.js?ver=2.2.2"></script>

jquery-ias.min.js download link: https://pan.baidu.com/s/1NJ8KCLj_zAJ0yB6WQxdimg Password: p6j6

Note: jquery.js library version must be greater than 1.6

2. Next, the js above writes the plug-in parameters to the page

<script type="text/javascript">
var ias = $.ias({
    container: ".listbox", //Elements that contain all articles
    item: ".item", //Article elements
    pagination: ".pagelist", //Paging elements
    next: ".pagelist a.nextpage", //Next page elements
});
ias.extension(new IASSpinnerExtension({
    src: "/img/load.gif", //This option is to buffer the picture when loading
    html: '<p style="text-align: center;"><img src="{src}"/></p>'
}));
ias.extension(new IASTriggerExtension({
    text: 'Click to load more', //This option is the text to be clicked
    html: '<p style="text-align: center; cursor: pointer;"><a>{text}</a></p>',
    offset: !1, //Set this item. For example, after the offset:2 page, you need to click manually to load. If offset:!1, it will always be infinite load
}));
ias.extension(new IASNoneLeftExtension({
    text: 'Loading completed!', // Prompt when loading is complete
    html: '<p style="text-align: center; cursor: pointer;"><a>{text}</a></p>',
}));
</script>

3. dedecms list template html code demonstration, note that listbox, item, pagelist, nextpage should be unified

<div class="listbox">
<ul class="e2">
{dede:list pagesize='10'}
<li class="item"><a href="[field:arcurl/]" class="title">[field:title/]</a></li>
{/dede:list}
</ul>
</div>
<ul class="pagelist">
{dede:pagelist listitem="next" listsize="1" runphp=yes}
@me = preg_replace('/<a\shref=([\'"]?).+?\1/', '$0 class="nextpage"', @me);
{/dede:pagelist}
</ul>

Done.