在手机端用的比较多的是滚动加载内容,对waypoints进行扩展可以很方便的加载列表。进行代码如下:
jQuery.fn.extend({
loaddate : function(opts){
var o = $.extend({
wp: {offset: ‘103%’},
hrefSelector: ‘.loadlink’,
databoxSelector: ‘#listbox’,
dataselector:’.list’
},opts||{});
var _this = this;
_this.waypoint(function(event, direction) {
_this.waypoint(‘remove’);
$.mobile.loading( ‘show’ );
var href = $(o.hrefSelector).attr(‘href’);
if(href == ‘#’){
$.mobile.loading(‘hide’);
return;
}
$.get(href, function(data) {
var data = $(data);
$(o.databoxSelector).append(data.find(‘.list’));
$.mobile.loading(‘hide’ );
$(o.hrefSelector).replaceWith(data.find(o.hrefSelector));
$(o.databoxSelector).listview(‘refresh’);
_this.waypoint(o.wp);
});
}, o.wp);
return _this;
}
});
在页面调用的话，加入控制加载的html标签:

然后可以方便调用:
$(‘#loadtag’).loaddate({
wp: {offset: ‘101%’},
hrefSelector: ‘.loadlink’,
databoxSelector: ‘#listbox’,
dataselector:’.list’});
这里的wp指的是waypoints的参数.