weui 加载提示_jquery-weui滚动加载问题解决
摘要： 2017年12月25日 jquery-weui滚动加载报错问题解决监听事件 infinite()，下面是源码，infinite(distance)接收distance参数，默认的 distance 值是 50，表示滚动到距离底部 50 px 的时候会触发加载。
2017年12月25日
jquery-weui滚动加载报错问题解决
监听事件 infinite()，下面是源码，infinite(distance)接收distance参数，默认的 distance 值是 50，表示滚动到距离底部 50 px 的时候会触发加载。所以页面初始化需要把请求的数据渲染html元素填满页面才会触发。
引入js
+function ($) {
"use strict";
var Infinite = function(el, distance) {
this.container = $(el);
this.container.data("infinite", this);
this.distance = distance || 50;
this.attachEvents();
}
Infinite.prototype.scroll = function() {
var container = this.container;
var offset = container.scrollHeight() - ($(window).height() + container.scrollTop());
if(offset <= this.distance) {
container.trigger("infinite");
}
}
Infinite.prototype.attachEvents = function(off) {
var el = this.container;
var scrollContainer = (el[0].tagName.toUpperCase() === "BODY" ? $(document) : el);
scrollContainer[off ? "off" : "on"]("scroll", $.proxy(this.scroll, this));
};
Infinite.prototype.detachEvents = function(off) {
this.attachEvents(true);
}
var infinite = function(el) {
attachEvents(el);
}
$.fn.infinite = function(distance) {
return this.each(function() {
new Infinite(this, distance);
});
}
$.fn.destroyInfinite = function() {
return this.each(function() {
var infinite = $(this).data("infinite");
if(infinite && infinite.detachEvents) infinite.detachEvents();
});
}
}($);复制代码
下面是页面代码
上拉加载
//上拉加载
var access = localStorage.getItem('login');
var loading = false;
var count = 0;
pullup ();
pullup ();
pullup ();
$(document.body).infinite(100).on("infinite", function() {
if(loading) return;
loading = true;
setTimeout(function(){
pullup ();
},1500);
});
function pullup (){
count++;
var request_data = {
'access_token': access,
'page': count
};
$.ajax({
type: 'post',
url: api.domain + list,
data: request_data,
success: function(res){
if(res.status == 1) {
if(res.data.data.length > 0) {
var n = res.data.data.length;
var $content = $('
for(var i = 0; i < n; i++) {
var health = 'v';
var $list = $('' +
'
'
' + res.data.data[i].username + '
' +'
'
'');
$list.appendTo($content);
}
$content.appendTo($('#parent'));
//$(document.body).destroyInfinite();
loading = false;
} else {
//$(document.body).destroyInfinite();
loading = false;
$.toast('没有更多');
$('#loadmore').addClass('hide');
}
} else {
$.toast(res.msg, 'cancel');
}
},
});
}复制代码