博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

兼容性js中setTimeout 传参“保值”方案

Posted on 2014-04-16 15:10  fochan  阅读(481)  评论(0编辑  收藏  举报

这里所谓“保值”,是指在setTimeout中指定的时间后,执行指定的方法所用到的“参数”值,跟执行setTimeout时该“参数”值一样。是不是有点懵?看如下例子:

=========================================

for(var i=0;i<10;i++)
{
  setTimeout(function(){alert(i);},i*1000);
}

期望:依次弹出0~9

实际:总是弹出10  原因:在若干时间后,所使用到的 i的值已经是 i最新的值,也就是在for中i的值瞬时加到的10。导致”传参”失真!

=========

兼容性保值方案

=========

for(var i=0;i<10;i++)
{

  (function(k){

  setTimeout(function(){alert(k);},k*1000);

  })(i);
}

效果:依次弹出0~9 原理:将i当时的值复制到匿名函数里,在其参数中”保值”。

=========================================

其实,我们上面用到的setTimeout是 setTimeout(code, delay) 这个版本。

其实还有另外一个版本:setTimeout(func, delay, [param1, param2, ...]),后面的param们就是调用func时给它传的参数。它可以很干净地解决“传参”失真的问题:

for(var i=0;i<10;i++)
{

  setTimeout(function(k){alert(k);},i*1000,i);

}

但是很遗憾!它不具有浏览器兼容性!在IE8及其以下是不支持的。可参考:http://www.cnblogs.com/cuixiping/archive/2010/01/24/1655033.html