自从认识了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. FileOutputStream和FileInputStream的用法

    public static void show() { File f=new File("d:"+File.separator+"1.txt"); FileOu ...

  2. Oracel EBS - Response

    Oracle ERP Response:

  3. SQL Server 2008 R2数据库镜像部署

    概述 “数据库镜像”是一种针对数据库高可用性的基于软件的解决方案.其维护着一个数据库的两个相同的副本,这两个副本分别放置在不同的SQL Server数据库实例中.建议使用不同位置的两台服务器来承载.在 ...

  4. MySQL数据的主从复制、半同步复制和主主复制详解

    一.MySQL复制概述 ⑴.MySQL数据的复制的基本介绍 目前MySQL数据库已经占去数据库市场上很大的份额,其一是由于MySQL数据的开源性和高性能,当然还有重要的一条就是免费~不过不知道还能免费 ...

  5. 数据结构与算法分析C++表述第二章编程题

    把昨天看的第二章巩固一下,做一做编程习题. 2.6: 第一天交2元罚金,以后每一天都是前一天的平方,第N天罚金将是多少? 这个题目和2.4.4-3介绍的幂运算基本一致.若按相同的递归思路分析,比那个问 ...

  6. Wordpress基础:安装主题和插件

    一:安装主题 1.下载主题 2.解压至wordpress目录下的/wp-content/themes 3.访问后台>外观>主题启用即可 二:安装插件 1.下载插件 2.解压至wordpre ...

  7. CXF调用webservice超时设置

    JaxWsProxyFactoryBean factory = new JaxWsProxyFactoryBean(); factory.setServiceClass(Service1Soap.cl ...

  8. js保留两位小数

    js保留两位小数四舍五入: (Math.floor(until_price*100)/100).toFixed(2);//会四舍五入   保留两位小数 且不四舍五入(三种方式,请用最后一种): var ...

  9. 首次用U盘安装CentOS

    安之前看了这篇文章,http://www.osyunwei.com/archives/2307.html,然后就开始了. 首先下载ultraiso,官网下载的,将centos的iso镜像写到u盘上. ...

  10. Windows 64位 RabbitMQ 安装配置

    1:下载Erlang,地址:http://www.erlang.org/download/otp_win64_19.0.exe ,双击安装即可(首先装) 2:下载RabbitMQ,RabbitMQ 3 ...