<script type="text/javascript" >  

window.onload=function(){  

        for(var i=1;i<3;i++){  

            var m ="i="+i;  

            setInterval(function(){test(m);},4000);  

        }  

    }  

    function test(e) {  

        alert(e);  

    }  

</script>

上面这段代码的运行结果是:

alert 只弹出i=2;

这样的结果给人一种好像只创建了一个setInterval方法或者说是定时器吧.其实如果你自己看还是会发现有时弹出的对话框是连续的两个对话框的,所以这个程序说明for循环中是初始化了两个计时器的.只不过是因为变量的问题所以产生了这种奇异的现象.

原因是setInterval这个计数器是在延迟4秒后才进行调用,而在这期间for循环还是会继续运行的,那么当setInterval执行时i的值已经变成2了;

<script type="text/javascript" >  

window.onload=function(){  

        for(var i=1;i<3;i++){  

            setInterval(function(){test(i);},4000);  

        }  

    }  

    function test(e) {  

        alert(e);  

    }  

</script>

那么上面这个alert的值却是3;这也就是说i传到setInterval这个计数器中的function参数是3,这个也是因为延迟的问题,当for循环执行完时i的值是3<因为i++了>

那么如何处理这种问题了:

这是一段代码:

[html]  

<html>  

<head>  

    <script type="text/javascript">         

        function intervalTest(){  

            var cks = document.getElementsByName("check");  

            for(var i=0;i<cks.length;i++){  

                if(cks[i].checked == true){  

                mySetInterval(test,(3-i)*1000,i);  

                }  

            }  

        }  

        function test(e) {  

            console.log(e);  

        }  

        function mySetInterval(f,time,param){  

            setInterval(function(){f(param);},time);  

        }  

    </script>  

</head>  

<body>  

    <input name="check" type="checkbox" id="1"/>OneCheck  

    <input name="check" type="checkbox" id="2"/>TwoCheck  

    <input name="check" type="checkbox" id="3"/>ThreeCheck  

    <input type="button" onclick="intervalTest()" value="IntervalTest"/>  

</body>  

</html>

上面主要是写了一个自己的方法mySetInterval(f,time,param)其中f为回调函数的名称,time为设置的间隔时间,param为f函数的参数值.

这样写的意思就是说当你在循环的时候就直接先调用我的这个方法,然后把参数传给我,然后你在进行for循环,这样就保证了每次传入的值不会在延迟time后而变化.

setInterval 传值设参数的更多相关文章

  1. setInterval()第一个参数带引号和不带引号的区别

    setInterval()第一个参数带引号和不带引号的区别:关于定时函数setInterval()的基本用法这里就不做介绍了,查阅相关教程即可,这里主要介绍一下setInterval()函数的第一个参 ...

  2. setInterval()的时间参数无法随参数的变化而变化

    2017-04-18 写了个随机抽奖的小案例,打算随机跳动十次,每次变化的时间越来越长,也就是跳动的速度越来越慢,结果发现setInterval的时间参数并不会随着变化. <!--案例的结构如下 ...

  3. 给定时器settimeout、setInterval调用传递参数

    无论是window.setTimeout还是window.setInterval,在使用函数名作为调用句柄时都不能带参数,而在 许多场合必须要带参数,这就需要想方法解决.例如对于函数hello(_na ...

  4. php 判断是否get传值的参数是否存在

    if(is_array($_GET)&&count($_GET)>0)//先判断是否通过get传值了    {        if(isset($_GET["id&qu ...

  5. 关于setTimeout和setInterval的函数参数问题

    今天在写验证码倒计时小demo时,用了如下代码: window.setTimeout(count(num),1000); 这样直接使用将使count函数立即执行,并将返回值传递给setTimeout函 ...

  6. JS中的setInterval 函数体带参数f方法

    1.setInterval(function code,delaytime); 在设置自动调用执行function code时,我们可以采用下面三种方式来解决. 一.采用字符串形式:(参数不能被周期性 ...

  7. vue调用兄弟组件的方法使用vueBus调用$emit、$on（只需触发方法即可，不需要考虑传值或参数的问题）

    触发方: vueBus.$emit('queryAll') 被触发方: created() { vueBus.$on('queryAll', () => { this.getList() // ...

  8. JavaScript中setInterval常见的问题（setInterval第一个参数加引号与不加引号区别）

  9. java 参数传值

    基本数据类型参数的传值,参数为基本数据类型 class Computer{ int add(int x,int y){ return x+y; } } public class Example4_6 ...

随机推荐

  1. poj 2566"Bound Found"(尺取法)

    传送门 参考资料: [1]:http://www.voidcn.com/article/p-huucvank-dv.html 题意: 题意就是找一个连续的子区间,使它的和的绝对值最接近target. ...

  2. idea 红线 并提示idea cant resolve symbol

    能编译通过说明SDK导入正确,但是为啥我们点击每一个Java文件会出现好多红色的下划线 ,并提示idea cant resolve symbol原因就是可能没有清除原来的历史缓存,导致一些错误,解决方 ...

  3. mysql视图、触发事务、存储过程

    视图 视图是一个虚拟表(非真实存在的),其本质就是根据SQL语言获取动态的数据集,并为其命名,用户使用时只需要使用名称即可获得结果集,可以将结果集当做表来使用. 视图是存在数据库中的,如果我们程序中使 ...

  4. 解决python安装错误问题

    遇到的问题描述: An error occurred during the installation of assemblyA Microsoft.VC90. CRT, version=9-0.307 ...

  5. Jqgrid pager 关于“local” dataType 动态加载数据分页的研究（没好用的研究结果）

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  6. CEdit编辑框字体和背景设置

    CEdit编辑框字体和背景设置注意事项:当CEdit为“disable”时,设置编辑框的字体和背景会没有效果.解决方案:将CEdit的Style设置为“readonly”,这样设置就能生效了,同时也能 ...

  7. As 400错

    8:25 Gradle sync started 8:25 Gradle sync failed: Unable to tunnel through proxy. Proxy returns &quo ...

  8. 2017-12-14python全栈9期第一天第四节之python分类

    python的环境. 编译型:一次性将所有程序编译成二进制文件. 缺点:开发效率低,不能跨平台. 优点:运行速度快. :C,C++等等. 解释型:当程序执行时,一行一行的解释. 优点:开发效率高,可以 ...

  9. reportgen :python生产pptx

    欢迎关注博主主页,学习python视频资源 https://www.cnblogs.com/gasongjian/p/8670925.html reportgen v0.1.8 更新介绍 这段时间,我 ...

  10. CatBoost算法和调参

    欢迎关注博主主页,学习python视频资源 sklearn实战-乳腺癌细胞数据挖掘(博主亲自录制视频) https://study.163.com/course/introduction.htm?co ...