var row = 6, page = 1;
var loading = false; //状态标记
$(document.body).infinite().on("infinite", function () {
if (loading) return;
loading = true;

setTimeout(function () {
var srow = row * (page - 1);
var erow = row * page;

loaddata(srow, erow);
loading = false;
}, 1500); //模拟延迟
});

function loaddata(srow, erow) {
var url = "";
var $html = "";

$.ajax({
type: "get",
url: url,
data: { "srow": srow, "erow": erow},
dataType: "json",
success: function (data) {
if (data == "" || data == null) {
$(document.body).destroyInfinite(); //销毁插件。之后再次调用
$("#load").hide();
// $.toast("无记录显示", "text");
} else {
var res = data;

if (res.length == 0 && page == 1) {
$(document.body).destroyInfinite(); //销毁插件。之后再次调用
$("#load").hide();
// $.toast("没有更多数据啦!", "text");
}
else {
if (res.length < row) {
$(document.body).destroyInfinite(); //销毁插件。之后再次调用
$("#load").hide();
}
var nowDate = new Date(getTime().replace(new RegExp(/-/gm), "/"));//解决兼容

for (var i in res) {
   $html += '<span></span>‘;
}

var $list = document.getElementById("list");
$list.innerHTML += $html;

page++;
}
}
},
error: function (msg) {
$.toptip('数据加载出错', 'error');
$("#load").hide();
}
})
}

WEUI滚动加载的更多相关文章

  1. jq weui 滚动加载的坑

    1.一般情况下使用官网给个demo就可以了,如下: var loading = false; //状态标记 $(document.body).infinite().on("infinite& ...

  2. Jquery WEUI 滚动加载(infinite)不触发

    源代码:(1.0.1版本) Infinite.prototype.scroll = function() { var container = this.container; var offset = ...

  3. 记录WEUI中滚动加载的一个BUG

    最近写微信公众号,用到的技术栈是jq+vue的混合开发,采用的UI是移动端比较火的WEUI,在微信开发中应该较广泛.个人看惯了elementUI文档,相对于饿了么组件文档的详细,WEUI的文档还是比较 ...

  4. jQuery WeUI 组件下拉刷新和滚动加载的实现

    最近在做手机版使用到了下拉刷新和滚动加载,记录一下实现过程: 一.引入文件 ? 1 2 3 4 <link rel="stylesheet" href="Conte ...

  5. jquery weui ajax滚动加载更多

    手机端使用jquery weui制作ajax滚动加载更多. 演示地址:http://wx.cnkfk.com/nuol/static/fpage.html 代码: <!DOCTYPE html& ...

  6. weui实现滚动加载的效果

    weui是微信公司提供的一个UI框架,在H5开发中一些组件可以直接使用.weui文档地址:http://www.jqweui.cn/components 使用weui,需要引入weui.css和jqu ...

  7. 记录JQ-WEUI中滚动加载的一个BUG

    最近写微信公众号,用到的技术栈是jq+vue的混合开发,采用的UI是移动端比较火的WEUI,在微信开发中应该较广泛.个人看惯了elementUI文档,相对于饿了么组件文档的详细,WEUI的文档还是比较 ...

  8. HTML5商城开发一 楼层滚动加载数据

    对于楼层加载在以前只是个想法,从来没实现过,刚好项目中碰到,再此总结一下 场景:HTML5,局部商品列表信息滚动(局部滚动条) 1.通过jq设置subCategoryScroll的高度为屏幕显示高度( ...

  9. js 滚动加载iframe框中内容

    var isIE6 = !!window.ActiveXObject&&!window.XMLHttpRequest; //滚动加载 var scrollLoad =function( ...

随机推荐

  1. jq三级联动

    test.html <div class="a_list"> <div class="a_title">商城分类:</div> ...

  2. 查看webdriver API

    pydoc是Python自带的模块,主要用于从python模块中自动生成文档 生成web页面文档: cmd->python -m pydoc -p 8888 -p:在本机上启动服务 8888:端 ...

  3. solr 入门

    这个博客写的不错,很详细 https://blog.csdn.net/wzy18210825916/article/details/80946454

  4. python全栈开发 * 线程队列 线程池 协程 * 180731

    一.线程队列 队列:1.Queue 先进先出 自带锁 数据安全 from queue import Queue from multiprocessing import Queue (IPC队列)2.L ...

  5. 原生js实现table表格列宽自由缩放

    <!DOCTYPE html> <html> <head> <meta charset="gbk"> <title>ta ...

  6. 精心调制的Bash主题分享

    第一个是米色背景, 一样遵守蓝色为目录的习惯, 字体为浅灰色,代码和终端看起来相对比较清晰 第二个则是 深海蓝的背景风格,字体都选择饱和度较高的颜色,如下图 终端 配置方法,这里以 mintty 也就 ...

  7. java并发请求多个接口,顺序返回

    最近有个需求,从一个api拿数据,但是api时间参数又有范围限制,因此需要自己将时间分成多段,多次请求api,并且最终返回的数据需要保持原有的顺序 代码如下: package com.test001. ...

  8. (转)cookie和session的区别

    存放位置不同 cookie数据存放在客户的浏览器上,session数据放在服务器上. 安全程度不同cookie不是很安全,别人可以解析存放在本地的cookie并进行cookie欺骗,考虑到安全应当使用 ...

  9. PrintWriter write返回数据显示中文变问号"???"

    在response.getWriter();前加上这些就ok了 response.setContentType("text/html;charset=UTF-8"); respon ...

  10. pytorch中tensorboardX的用法

    在代码中改好存储Log的路径 命令行中输入 tensorboard --logdir /home/huihua/NewDisk1/PycharmProjects/pytorch-deeplab-xce ...