在做wordpress分页时，希望随着用户滚轴的滚动，而自动加载下一页的数据，那么就可以用到这个插件jquery.ias.js。

ias的全称是Infinite Ajax Scroll，无限ajax滚动加载插件。

使用方法

1、引入jquery.ias.js

<script src="/js/jquery.ias.js"></script>

2、页面的html结构

<div class="content">

<article class="excerpt">列表一</article>

<article class="excerpt">列表二</article>

<article class="excerpt">列表三</article>

</div>

<div class="pagination">

<ul>

<li class="next-page"><a href="#">页码</a></li>

</ul>

</div>

3、添加对于的js

var ias = $.ias({

thresholdMargin: 400,

triggerPageThreshold : 5,

history : true,

container : '.content',

item : '.excerpt',

pagination : '.pagination',

next : '.next-page a'

});

ias.extension(new IASTriggerExtension({

offset: 0,

text: '加载更多···',

html: '<div class="ias-trigger ias-trigger-prev bee" style=" text-align: center; margin-top: 10px; "><a class="btn btn-primary">{text}</a></div>'

}));

ias.extension(new IASSpinnerExtension({

src: FFUI.uri+'/images/loading.gif',

html: '<div class="pagination-loading"><img src="{src}"/></div>'

}));

也可以用下面的js

jQuery.ias({

history: false,

container : '.content',

item: '.excerpt',

pagination: '.pagination',

next: '.next-page a',

trigger: '查看更多',

loader: '<div class="pagination-loading"><img src="/blog/images/loading.gif" /></div>',

triggerPageThreshold: 5,

onRenderComplete: function() {

$('.excerpt .thumb').lazyload({

placeholder: '/blog/images/occupying.png',

threshold: 400

});

$('.excerpt img').attr('draggable','false');

$('.excerpt a').attr('draggable','false');

}

});

4、代码详细解释

container：分页数据的上一层标签定位，这里指的是class=’content’的标签。

item：在container中的一条条的分页数据的定位标识，这里指的是class=’excerpt’的标签。

pagination：分页模块的顶层标签，这里指的是class=’pagination’的标签，插件会自动将其隐藏。

next：用以获取下一页的分页连接，这里指的是class=’next-page’下面的a标签。

trigger：当分页自动加载到一定页数后，会触发手动分页。该参数就是其展示值。如果不设置，则会显示默认值。

loader：自动加载器内容，是一个html标签。如果不设置，则会显示默认值。

triggerPageThreshold：自动加载的数量。如上所示，当触发自动加载时，则会自动加载5页的内容。