自从认识了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. Unity3D连接sqlite数据库操作C#版

    unity3d有自己对应的sqlite.dll分别需要三个文件 1.Mono.Data.Sqlite.dll 在unity安装文件“Unity\Editor\Data\MonoBleedingEdge ...

  2. java并发编程（四）守护进程 线程阻塞的四种情况

    转载请注明出处:http://blog.csdn.net/ns_code/article/details/17099981 守护线程   Java中有两类线程:User Thread(用户线程).Da ...

  3. antmate.css

    本文各式各样的动画来源于http://daneden.github.io/animate.css/ ,若想看效果可复制运行下文,或到该网站自行查阅. <!DOCTYPE html> < ...

  4. ORA-12519: TNS:no appropriate service handler found 解决(转)

    可能是数据库上当前的连接数目已经超过了它能够处理的最大值. select count(*) from v$process --当前的连接数 select value from v$parameter  ...

  5. swif-自动引用计数

    import UIKit /* class Person { let name: String //强引用 init(name: String) { self.name = name print(&q ...

  6. UE4开发神秘海域类游戏原型 初阶（二）：动画资源的整合

    前一篇已经确定神海类游戏原型的目标,首先要做的就是3C's(Character, Controls, Camera)的开发.   UE4的3C's的程序部分开发主要也就是基于他的GamePlay Fr ...

  7. hibernate学习（5）——一对多关系表达

    一对多实现 1. 实现类 package com.alice.hibernate02.vo; import java.util.HashSet; import java.util.Set; publi ...

  8. laravel DB事物

    public function store(Request $request, $id) { $externalAccount = ExternalAccounts::find($id); DB::b ...

  9. python学习道路(day7note)(subprocess模块，面向对象)

    1.subprocess模块   因为方法较多我就写在code里面了,后面有注释 #!/usr/bin/env python #_*_coding:utf-8_*_ #linux 上调用python脚 ...

  10. CACHE COHERENCE AND THE MESI PROTOCOL

    COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION In contemporary multi ...