jQuery中的setTimeout用法

昨天开始写页面的翻页效果，遇到setTimeout的难题，今天才得以解决.

开始时我遇到的问题是

function shiyan1(){
       alert();
}
$("img").click(function(){
       setTimeout(shiyan1(), 2000);
})

这个问题肯定很多人犯，这个程序不会在两秒后执行，而是直接执行，因为你写了括号，他就直接调用了shiyan1()函数，

而你写    setTimeout(shiyan1, 2000);  就不会出这个问题

但是问题是要是你传参数怎么办呢

于是我找了不少资料，总于在网上找到了，以下内容出自

http://www.studyday.net/2011/01/177 

jQuery 中 setTimeout/setInterval 不能像在原生态 javascript 中那样使用, 否则会报错.
我们通过例子来说明一下jQuery中setTimeout的几种使用方法, 首先准备好测试用的DIV和公共函数:

<div id="div_debug"></div>
<script src="http://www.studyday.net/demo/jquery.js"></script>
<script language="JavaScript">
    function log(s){
         $('#div_debug').append(s+'<br>');
    }

//下文中测试用的代码可以放在这一行注释的下面,替换掉 //...
//...

</script>

原生态 javascript 中的 setTimeout 基本用法是像这样子的.

//原生态 javascript 中的 setTimeout 基本用法

function funA(){
      log('funA...');
      setTimeout('funA()', 1000);
}
funA();

下面是jQuery中setTimeout的几种使用方法. 在线实例

//jQuery 中的用法

function funA(){

    log('funA...');

    setTimeout('funA()', 1000);

}

jQuery(document).ready(function($){

     //用法1 : 把要调用的函数写在ready外面,使它成为全局函数

    funA();

 

    //用法2 : 直接写函数名,不能带括号也不能带引号,适合没有参数的函数

    function funB(){

        log('funB...');

        setTimeout(funB, 1000);

    }

    funB();

 

     //用法3 : 通过调用匿名函数来执行,适合有带参数的函数

    function funC(v){

        log('funC...'+v);

        setTimeout(function(){funC(v+1)}, 1000);

    }

    funC(1);

 

    //用法4 : 通过在jQuery命名空间上增加函数,适用面更广

    $.extend({

            funD:function(v){

                log('funD...'+v);

                setTimeout("$.funD("+(v+1)+")",1000);

            }

      });

      $.funD(100);

 });

用法2和用法3的区别很明显, 但用法3和用法4的区别在哪里呢?为什么说用法4比用法3适用面更广呢?通过下面这个例子可以很直观的明白二者的区别:

jQuery(document).ready(function($){

    //用法3 : 通过调用匿名函数来执行,适合有带参数的函数

    function funC(v){

        log('funC...'+v);

        setTimeout(function(){funC(v+1)}, 1000);

    }

 

    //用法4 : 通过在jQuery命名空间上增加函数,调用起来更方便

    $.extend({

        funD:function(v){

            log('funD...'+v);

            setTimeout("$.funD("+(v+1)+")",1000);

        }

    });

});

 

jQuery(document).ready(function($){

    //funC(1);   //去掉注释后执行这一句时会报错

    $.funD(100); //这一句是正常的, 明白两者之间的区别了吧

});

另外 setInterval 也同样适合上面所说的4种方法.