您现在的位置: 365建站网 > 365文章 > JS/javascript中setInterval、setTimeout不能传递带参数函数的解决方法

JS/javascript中setInterval、setTimeout不能传递带参数函数的解决方法

文章来源:365jz.com     点击数:491    更新时间:2017-12-23 20:32   参与评论
JavaScript的setInterval()函数用于设定每隔指定的时间就执行对应的函数或代码。

该函数属于全局对象window。

语法

setInterval()函数的语法如下:

setInterval ( code, milliseconds[, args...] )

参数

code 需要执行的函数或js代码
milliseconds 执行函数或代码的间隔时间,单位为毫秒
args 可选参数用于给被调用的函数传递参数,参数可以有多个

在JS/javascript中无论是setTimeout还是setInterval,在使用函数名作为调用句柄时都不能带参数,而在许多场合必须要带参数,
这就需要想方法解决。
一、采用字符串形式:——(缺陷)参数不能被周期性改变
setInterval("foo(id)",1000);
二、匿名函数包装 (推荐)

</>code

  1. window.setInterval(function()
  2. {
  3. foo (id);
  4. }, 1000);

这样就可以周期性执行foo(id)这个函数,而且把变量id传递进去;
三、定义返回无参函数的函数

</>code

  1. function foo(id)
  2. {
  3. alert(id);
  4. }
  5. function _foo(id)
  6. {
  7. return function()
  8. {
  9. foo(id);
  10. }
  11. }
  12. window.setInterval(_foo(id),1000);

这里定义了一个函数_foo,用于接收一个参数,并返回一个不带参数的函数,在这个函数内部使用了外部函数的参数,从而对其调用,不需要使用参数。
在 window. setInterval函数中,使用_foo(id)来返回一个不带参数的函数句柄,从而实现了参数传递的功能。
四、修改setInterval

</>code

  1. function foo(id)
  2. {
  3. alert(id);
  4. }
  5. var _sto = setInterval;
  6. window.setInterval = function(callback,timeout,param)
  7. {
  8. var args = Array.prototype.slice.call(arguments,2);
  9. var _cb = function()
  10. {
  11. callback.apply(null,args);
  12. }
  13. _sto(_cb,timeout);
  14. }
  15. window.setInterval(hello,3000,userName);

以上的所有方法也适合setTimeout。

jQuery中setInterval()方法:

定义和用法:

setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

var time=0;

用法1:

</>code

  1. function jump(){
  2.   …………  //函数内容
  3. }
  4. time = setInterval("jump",5000); //每个五秒调用一次函数

当需要暂停的时候

</>code

  1.   $("").hover(function(){
  2.     clearInterval(time),function(){
  3.     time = setInterval("jump",5000);
  4.     }  
  5.   })

用法2:

</>code

  1. function autoPlay(){
  2.   time = setInterval(function(){
  3.     …………   //函数内容
  4.   },5000);
  5. }
  6. autoPlay();  //调用函数

当需要暂停时

</>code

  1.    $("").hover(function(){
  2.     clearInterval(time),function(){
  3.     autoPlay();
  4.     }  
  5.   })

总结:

第一种用法思路比较清晰,先设置一个函数,在通过setInterval来自行调用,但是将其在别处调用比较困难;

第二种方法看起来比较乱,在setInterval内部写下自行调用的函数,然后在给他套上一个有名函数,然后通过调用有名函数来实行自动,在别处调用比较方便。

以上纯属个人看法,希望大神们多多指点。

如对本文有疑问,请提交到交流论坛,广大热心网友会为你解答!! 点击进入论坛

发表评论 (491人查看0条评论)
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
昵称:
最新评论
------分隔线----------------------------

快速入口

· 365软件
· 杰创官网
· 建站工具
· 网站大全

其它栏目

· 建站教程
· 365学习

业务咨询

· 技术支持
· 服务时间:9:00-18:00
365建站网二维码

Powered by 365建站网 RSS地图 HTML地图

copyright © 2013-2024 版权所有 鄂ICP备17013400号