引用iscroll的一个封装方法
var Page = function(cid, data,callback) {
var _self = this;
var cid = $(cid);
var currPage=1;
// 下拉上拉加载数据
var myScroll, pullDownEl, pullDownOffset, pullUpEl, pullUpOffset, generatedCount = 0;
this.query = function(curr) {
if(curr){
currPage=curr;
}
data["PAGE_INFO.currentPage"]=currPage;
if(!myScroll){loaded();}
PAjax({
data : data,
success : function(json) {
$('#loading').hide();
if (isEmpty(json.MSG)) {
currPage++;
var list = json.PAGE_LIST;
_self.addBillHtml(list);
myScroll.refresh();
} else {
_alert(json.MSG, "", function() {
var html = '<li class="listCenter">数据加载失败!</li>';
$(cid).append(html);
});
}
}
});
}
this.refresh=function(){
cid.empty();
_self.query(1);
}
this.addBillHtml = function(list) {
if (list && list.length > 0) {
var htmls = [];
$.each(list, function() {
var html = callback(cid, this);
htmls.push(html);
})
cid.append(htmls);
} else {
$("#pullUp").hide();
$(".endList").show();
}
;
myScroll.refresh();
}
this.iScrollClick = function() {
if (/iPhone|iPad|iPod|Macintosh/i.test(navigator.userAgent))
return false;
if (/Chrome/i.test(navigator.userAgent))
return (/Android/i.test(navigator.userAgent));
if (/Silk/i.test(navigator.userAgent))
return false;
if (/Android/i.test(navigator.userAgent)) {
var s = navigator.userAgent.substr(navigator.userAgent
.indexOf('Android') + 8, 3);
return parseFloat(s[0] + s[3]) < 44 ? false : true
}
}
// 初始化iScroll控件
function loaded() {
pullDownEl = document.getElementById('pullDown');
pullDownOffset = pullDownEl.offsetHeight;
pullUpEl = document.getElementById('pullUp');
pullUpOffset = pullUpEl.offsetHeight;
myScroll = new iScroll(
'wrapper',
{
scrollbarClass : 'myScrollbar', /* 重要样式 */
useTransition : false, /* 此属性不知用意,本人从true改为false */
topOffset : pullDownOffset,
onRefresh : function() {
if (pullDownEl.className.match('loading')) {
pullDownEl.className = '';
//pullDownEl.querySelector('.pullDownLabel').innerHTML = '下拉刷新...';
} else if (pullUpEl.className.match('loading')) {
pullUpEl.className = '';
pullUpEl.querySelector('.pullUpLabel').innerHTML = '上拉加载更多...';
}
},
onScrollMove : function() {
/*if (this.y > 5 && !pullDownEl.className.match('flip')) {
pullDownEl.className = 'flip';
pullDownEl.querySelector('.pullDownLabel').innerHTML = '松手开始更新...';
this.minScrollY = 0;
} else if (this.y < 5
&& pullDownEl.className.match('flip')) {
pullDownEl.className = '';
pullDownEl.querySelector('.pullDownLabel').innerHTML = '下拉刷新...';
this.minScrollY = -pullDownOffset;
} else */
if (this.y<0 && this.y < (this.maxScrollY - 5)
&& !pullUpEl.className.match('flip')) {
pullUpEl.className = 'flip';
pullUpEl.querySelector('.pullUpLabel').innerHTML = '释放立即加载...';
this.maxScrollY = this.maxScrollY;
} else if (this.y<0 && this.y > (this.maxScrollY + 5)
&& pullUpEl.className.match('flip')) {
pullUpEl.className = '';
pullUpEl.querySelector('.pullUpLabel').innerHTML = '上拉加载更多...';
this.maxScrollY = pullUpOffset;
}
},
onScrollEnd : function() {
if (pullDownEl.className.match('flip')) {
//pullDownEl.className = 'loading';
// pullDownEl.querySelector('.pullDownLabel').innerHTML = '加载中...';
// pullDownAction(); // Execute custom function
// (ajax call?)
} else if (pullUpEl.className.match('flip')) {
pullUpEl.className = 'loading';
pullUpEl.querySelector('.pullUpLabel').innerHTML = '加载中...';
// pullUpAction(); // Execute custom function (ajax
// call?)
_self.query();
}
}
});
setTimeout(function() {
document.getElementById('wrapper').style.left = '0';
}, 800);
}
// 初始化绑定iScroll控件
/*document.addEventListener('touchmove', function(e) {
e.preventDefault();
}, false);*/
document.addEventListener('DOMContentLoaded', loaded, false);
}
引用
page=new Page(tabs,data,addRow);
page.query();
引用iscroll的一个封装方法的更多相关文章
- 【eclipse jar包】在编写java代码时,为方便编程,常常会引用别人已经实现的方法,通常会封装成jar包,我们在编写时,只需引入到Eclipse中即可。
Eclipse中导入外部jar包 在编写java代码时,为方便编程,常常会引用别人已经实现的方法,通常会封装成jar包,我们在编写时,只需引入到Eclipse中即可. 工具/原料 Eclipse 需要 ...
- 自己封装的一个js方法用于获取显示的星期和日期时间
自己封装的一个js方法用于获取显示的星期和日期时间 /** * 获取用于显示的星期和日期时间 * @param date * @returns {string} */ function getWeek ...
- JS实现继承,封装一个extends方法
父类 function Person(name,age){ this.name = name; this.age = age; } Person.prototype = { eat:function( ...
- 使用一个封装的json删除方法
<!-- 前台js代码:其实现的目的:利用异步的封装方法实现增删改操作!--> <script type="text/javascript"> functi ...
- 引用iScroll.js实现上拉和下拖刷新
使用技巧 1.引用iScroll.js, 在初始化时添加两个事件监听:touchMove.DOMContentLoaded. 2.实现iScroll插件的onScrollEnd事件, 也就是在这个事件 ...
- Lambda语言篇 —— lambda, 方法引用, 目标类型和默认方法
本文介绍了Java SE 8中新引入的lambda语言特性以及这些特性背后的设计思想.这些特性包括: lambda表达式(又被成为"闭包"或"匿名方法") 方法 ...
- .Net基础——程序集与CIL HttpClient封装方法 .Net Core 编码规范 C#中invoke和beginInvoke的使用 WebServeice 动态代理类
.Net基础——程序集与CIL 1. 程序集和CIL: 程序集是由.NET语言的编译器接受源代码文件产生的输出文件,通常分为 exe和dll两类,其中exe包含Main入口方法可以双击执行,dll ...
- 关于GeneXus封装方法Model的方法
最近 刚从外地出差回来 工作任务不是很重 能够抽点时间记点东西 下午花了2个多钟头尝试了一下GeneXus的封装方法的功能,这里记一下便于自己以后查看.我们在许多项目中或多或少都会有着重复代码编写的 ...
- Javascript 封装方法
基本封装方法 请看下面的例子: var Person = function(name,age){ this.name = name; this.age = age || "未填写" ...
随机推荐
- Spout的实现步骤
Spout的实现步骤: · 对文件的改变进行分开的监听,并监视文件夹下有无新日志文件加入. · 在数据得到了字段的说明后,将其转换成tuple. · 声明Sp ...
- Python函数式编程:内置函数reduce 使用说明
一.概述 reduce操作是函数式编程中的重要技术之一,其作用是通过对一个集合的操作,可以从中生成一个值.比如最常见的求和,求最大值.最小值等都是reduce操作的典型例子.python通过内置red ...
- Jquery的text()和html()方法在li与div取值结果解析
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 《HTML 5网页开发实例具体解释》文件夹
第一篇 从宏观上认识HTML 5 讲述了HTML 5引发的Web革命.HTML 5的总体特性.HTML 5相关概念和框架和开发环境搭建. 第1章 HTML 5引发的Web革命 1.1 你是不是真的 ...
- quartz群调查调度机制和源代码分析
pageId=85056282#quartz集群调度机制调研及源代码分析-quartz2.2.1集群调度机制调研及源代码分析" style="color:rgb(59,115,17 ...
- Java程序猿从笨鸟到菜鸟之(九十二)深入java虚拟机(一)——java虚拟机底层结构具体解释
本文来自:曹胜欢博客专栏.转载请注明出处:http://blog.csdn.net/csh624366188 在曾经的博客里面,我们介绍了在java领域中大部分的知识点,从最基础的java最基本的语法 ...
- C++ 函数声明中指定,默认参数
C++ 在声明函数的时候,如果指定了,参数的默认值,再调用函数的时候可以省略后面的参数. 如果调用函数写上的参数,但是不全.参数列表后面的使用默认值.如下例子,一看就清楚了. #include < ...
- WinForm 使用皮肤,且单击按更换皮肤。
运行效果: 首先把DLL程序集文件和SSK皮肤文件放在要运行程序的DEBug文件夹下,然后引入引用. 之后可以在程序里写代码了. private void Form2_Load(object send ...
- linux查看端口和进程
查看进程 ps -aux | grep appname 杀死进程 kill pid 查看端口: netstat -ap | grep 端口号 netstat -ap | grep 进程名字 lsof ...
- SignalR系列教程:SignalR快速入门
---恢复内容开始--- 本篇是SignalR系列教程的第一篇,本篇内容介绍了如何创建SignalR应用,如何利用SignalR搭建简易的聊天室等,本篇内容参考自:http://www.asp.net ...