js 链式延迟执行DOME_Javascript教程-查字典教程网
js 链式延迟执行DOME
js 链式延迟执行DOME
发布时间:2016-12-30 来源:查字典编辑
摘要:这样的形式执行:复制代码代码如下:d.wait(3000).run(function(m){//等待3秒alert('从前有座山');})....

这样的形式执行:

复制代码 代码如下:

d.wait(3000).run(function(m){ //等待3秒

alert('从前有座山');

}).wait(1000).run(function(m){ //等待1秒

alert('山里有座庙');

}).wait(2000).run(function(m){ //等待2秒

alert('庙里有一个老和尚给一个小和尚讲故事');

}).wait(3000).run(function(m){ //等待3秒

alert('讲的故事是:');

}).goStart(); //跳到第一条重新执行,这句拿掉就只执行一次

复制代码 代码如下:

<!doctype html>

<html>

<head>

<title>异步执行</title>

</head>

<body>

<script type="text/javascript">

function Delay(){

this.funList= [];

this.index = 0;

this.re = null;

this.isloop = false;

};

Delay.prototype = {

wait:function(m){

if(this.funList[this.index] && typeof this.funList[this.index].fun != 'function'){

m += this.funList[this.index].m;

}

this.funList[this.index] = {m:m,fun:null};

return this;

},

run:function(fun){

if(typeof this.funList[this.index].fun != 'function'){

this.funList[this.index].fun = fun;

this.index++;

}else{

this.index++;

this.funList[this.index] = {'m':0,'fun':fun};

}

this.start();

return this;

},

start:function(){

var self = this;

if(this.re) return;

var setOutrun = function(funList,index){

if(funList[index] == undefined){

clearTimeout(self.re);

return false;

}

var m = funList[index].m,

fun = funList[index].fun;

typeof fun == 'function' || (fun = function(){});

self.re = setTimeout(function(){

if(fun(index) === false)return false;

if(self.isloop){

index = -1;

self.isloop = false;

}

setOutrun(funList,++index);

},m);

}

setOutrun(this.funList,0);

},

stop:function(){

return clearTimeout(this.re);

},

goStart:function(){

var self = this,

fun = function(){

self.isloop = true;

};

if(this.funList[this.index] && typeof this.funList[this.index].fun != 'function'){

this.funList[this.index].fun = fun;

this.index++;

}else{

this.funList[this.index] = {'m':0,'fun':fun};

}

this.start();

}

};

var d = new Delay();

d.wait(3000).run(function(m){

alert('从前有座山');

}).wait(2000).run(function(m){

alert('山里有座庙');

}).wait(2000).run(function(m){

alert('庙里有一个老和尚给一个小和尚讲故事');

}).wait(2000).run(function(m){

alert('讲的故事是:');

}).goStart();

</script></body>

</html>

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类