自从认识了jQuery后,很多页面加载入口,都放在document.ready里面。但是有时候这个觉得ready加载太慢,

这个【监测类 】就开始产生了

效果类似这个。

每10毫秒检查一次,直到加载了jQuery 和$.fn.lazyload,再初始化页面

 var jqloadIvl=setInterval(function(){
if(typeof jQuery!="undefined" && typeof $.fn.lazyload =="function"){
$('.productbox img').lazyload({ threshold:200});
clearInterval(jqloadIvl);
}
},10);

于是写成一个类

监控变量c,直到c==1,才调用callback这个函数

<!DOCTYPE>
<html>
<head>
<title>测试</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="http://files.cnblogs.com/files/hhkedang/waiter.js"></script>
</head> <body>
<script>
var c=0;
var w = new Waiter();
w.check( function () {
return c==1;
});
w.callback(function(){
alert("Ok");
});
w.threshold = 100;//100毫秒检查一次
w.listen(); var setone=function(){
c=1;
}
</script>
<input type="button" value="把值为1" onclick="setone()" />
</body>
</html>

按例2:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试</title>
<script src="http://files.cnblogs.com/files/hhkedang/waiter.js"></script>
</head> <body>
<script>
var __index;
var data="";
var w = new Waiter();
w.check(function () {
return typeof data !="undefined" && data.length>=10;
});
w.check(function () {
return typeof data != "undefined" && data.length >= 20;
});
w.callback(function(){
console.log("数据10加载完毕"); });
w.callback(function () {
console.log("数据20加载完毕"); });
w.threshold = 10;//默认100毫秒
w.listen(); //模拟加载数据过程
__index=setInterval(function(){
data += "■";
document.title = data;
},100);
</script> </body>
</html>

实例2里,检测 data 的过程,分段检查。

下载write.js

js 一个自写的 监测类的更多相关文章

  1. JAVA一个文件写多个类

    JAVA一个文件写多个类,并且是同级类,需注意: 在一个.java文件中可以有多个同级类,  其修饰符只可以public/abstract/final/和无修饰符 public修饰的只能有一个,且必须 ...

  2. vue element-ui怎样提炼一个自己写的js当作公共js

    vue element-ui怎样提炼一个自己写的js当作公共js请教一下各位大神,我刚刚触摸vue element-ui几天,写的一个清晰检索的input框,现在需当作项目公共的部分,可遭需的html ...

  3. 用node.js从零开始去写一个简单的爬虫

    如果你不会Python语言,正好又是一个node.js小白,看完这篇文章之后,一定会觉得受益匪浅,感受到自己又新get到了一门技能,如何用node.js从零开始去写一个简单的爬虫,十分钟时间就能搞定, ...

  4. 写shell工具类,一个常用实例

    简述: 当我们常用到某些指令时,我们就需要将这个命令进行封装.封装的设计和扩展,因人而异.但为了每个人都能够了解到这个命令,常需要写出这个类的help. 关键字: 函数.getopts 函数 通过自定 ...

  5. JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  6. 几道JS代码手写面试题

    几道JS代码手写面试题   (1) 高阶段函数实现AOP(面向切面编程)    Function.prototype.before = function (beforefn) {        let ...

  7. springmvc2 一个控制器写多个方法(非注解方式)

    出处:http://blog.csdn.net/xuewenke/article/details/23895999 springmvc2 一个控制器写多个方法(非注解方式) 分类: spring 20 ...

  8. SpringMVC实现一个controller写多个方法

    MultiActionController与ParameterMethodNameResolver在一个Controller类中定义多个方法,并根据使用者的请求来执行当中的某个方法,相当于Struts ...

  9. 一个网友写的栈,问为啥不能迭代。具有__iter__ 和next方法的对象叫迭代器-七七巴巴黄页网

    一个网友写的栈,问为啥不能迭代.具有__iter__ 和next方法的对象叫迭代器-七七巴巴黄页网 一个网友写的栈,问为啥不能迭代.具有__iter__ 和next方法的对象叫迭代器 python视频 ...

随机推荐

  1. noip200802排座椅

    排座椅 难度级别:B: 运行时间限制:1000ms: 运行空间限制:51200KB: 代码长度限制:2000000B 试题描述 上课的时候总有一些同学和前后左右的人交头接耳,这是令小学班主任十分头疼的 ...

  2. ajax同步的实现

    if (window.XMLHttpRequest) {// code for IE7, Firefox, Opera, etc. xmlhttp=new XMLHttpRequest(); }els ...

  3. Delphi字符串简码

    从网上找的三个函数自己修改了下,在delphi7运行正常,unicode的版本不能用好像 输入:1abc天天 输出:1ABCTT unit UnitJM; interface uses SysUtil ...

  4. EMF学习,为了实现可扩展可自定义的模型验证 - 各种实现方法学习

    自: http://blog.csdn.net/javaman_chen/article/details/6057033 http://www.ibm.com/developerworks/cn/op ...

  5. VI操作命令

    1. 按下esc键,非insert模式下 鼠标移入到 home x 删除光标处单个字符 dd 删除光标所在行 u 撤销最近一次操作 yy 复制当前行 yw 复制当前光标到单词末尾 y$ 复制所在位置到 ...

  6. 关于页面中table中相同的列自动合并

    代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  7. URL地址中使用中文作为的参数【转】

    原文:http://blog.csdn.net/blueheart20/article/details/43766713 引言: 在Restful类的服务设计中,经常会碰到需要在URL地址中使用中文作 ...

  8. 带你玩转JavaWeb开发之五-如何完成响应式开发页面

    响应式页面开发 使用BootStrap开发一个响应式的页面出来 响应式开发就是同一个页面在PC端与手机端Pad端显示不同的效果,以给用户更好的体验 需求分析 开发一套页面,让用户能够在PC端, Pad ...

  9. python+selenium生成测试报告后自动发送邮件

    标签(空格分隔): 自动化测试 运行自动化脚本后,会产生测试报告,而将测试报告自动发送给相关人员,能够让对方及时的了解测试情况,查看测试结果. 整个脚本包括三个部分: 生成测试报告 获取最新的测试报告 ...

  10. 解决Entity Framework中DateTime类型字段异常

    从 datetime2 数据类型到 datetime 数据类型的转换产生一个超出范围的值 具体的错误原因是:C#中的DateTime类型比SqlServer中的datetime范围大.SqlServe ...