JS关于计时器函数传参
来源:互联网 发布:怎么才能在淘宝上卖东西 编辑:程序博客网 时间:2024/06/07 04:43
学前端的都知道函数方法,分为系统函数、自定义函数;有参函数、无参函数;有返回值函数、无返回值函数;有名函数、无名函数;
但是把作为新手的我最近碰到了一个奇特的事情,那就是计时器的普遍用法几乎不会传递参数,可是吧,就偏偏传一个参数进去就代码就能简单多了,情况是这样的:我要让很多div运动起来。
<div id="div0" style="width: 100%;height: 0px;background-color: #789;"></div><div id="div1" style="width: 0;height: 100px;background-color: #789;"></div><script type="text/javascript"> window.onload = function() { var oDiv0=document.getElementById("div0"); var oDiv1=document.getElementById("div1"); var time = null; var namber=0; function a() { namber++; oDiv0.style.height=namber+"px"; oDiv1.style.width=namber+"px"; if (namber>=60) { clearTimeout(time); return ; } time=setTimeout(a,1); } a(); }</script>
那就要这样做,或者把宽和高分开来写,因为函数a里面一旦放参数。。。嗯~,就这样了
因为在计时器里用的时候是没有参数传递进去的,那么这样呢?
<div id="div0" style="width: 100%;height: 0px;background-color: #789;"></div><div id="div1" style="width: 0;height: 100px;background-color: #789;"></div><script type="text/javascript"> window.onload = function() { var oDiv0=document.getElementById("div0"); var oDiv1=document.getElementById("div1"); var time = null; var namber=0; function a(b) { namber++; b.style.height=namber+"px"; if (namber>=60) { clearTimeout(time); return ; } time=setTimeout(a(b),1); } a(oDiv0); }</script>
经过测试,浏览器干脆了,直接给我一个行高60px的div,我能怎么办,我也很绝望啊,于是好了,我直接回去复习计时器。
setInterval(a,5000);setInterval(function a(){ },5000);setTimeout(a,5000);
当看到这里的时候,相信很多人都已经想到了点什么,尤其是学过后台语言的人,就像点击事件一样,哎呀好气阿
oBtn.onclick=a(b);//是一种oBtn.onclick=function(){a(b)};//也是一种
那么最后也就做成一个方法就好了
<div id="div0" style="width: 100%;height: 0px;background-color: #789;"></div><div id="div1" style="width: 0;height: 100px;background-color: #789;"></div><script type="text/javascript"> window.onload = function() { var oDiv0=document.getElementById("div0"); var oDiv1=document.getElementById("div1"); var time = []; function a(b,c,d,e,f) { b.style[c]=b[d]+1+"px"; if (b[d]>=e) { clearTimeout(time[f]); return ; } time[f]=setTimeout(function(){a(b,c,d,e,f);},1); } a(oDiv0,"height","offsetHeight",70,0); a(oDiv1,"width","offsetWidth",70,1); }</script>
参数是有点多阿,作为使用者,感觉time放在外面实在不实用,有待改进,那么计时器传递参数就到这里,其实上述事件都是假的,请别怀疑,只是觉得这个问题很容易被忽略所以指出来。
因为新人,还不知道怎么将网页调试结果放上来,想要调试的就自建一个文档将高光代码块复制到body标签里,文档后缀改为.html执行就好。
阅读全文
0 0
- JS关于计时器函数传参
- 关于JS计时器的一些应用
- js中关于计时器的案例
- 关于js定时器函数传参问题
- js计时器。
- js计时器
- js计时器
- JS计时器
- js计时器
- js计时器
- JS计时器
- js计时器
- JS 计时器
- js计时器
- JS 计时器
- JS计时器
- JS计时器
- js计时器
- LNK2005 __CRT_RTC_INIT already defined in LIBCMTD.lib(_init_.obj)
- java中的Timer TimerTask ScheduledExecutorService
- 使用PySide实现生命游戏
- 1002. A+B for Polynomials (25)
- js与flash交互
- JS关于计时器函数传参
- jquery实时监控textarea文本框中的字符(中文汉字及标点、英文字母及标点、数字)长度
- QT学习源网址转载1---QT多线程参数传递(信号与槽)方法
- BadNeighbors
- 健康一直都在,太一三和守护。
- NC反弹的小demo
- java中“53”个关键字(含2个保留字)
- 回形取数
- 剑指offer-第一个只出现一次的字符