js 计时器无法清除是为什么

Question

1.代码下方。简短说就是两个计时器让 div 向左或向右移动；两个button控制向左或向右的事件；当其中一个button按下时，设想让另一个button的计时器清除掉，通过function的形参判断是哪个button；2.代码运行后没有按照设定想法实现，现象是 当div向左移动后，点击另一个button（即buttno）,结果div反复同时向左向右运动，函数中的清除计时器的代码没有起效；这是为什么？function fun(flag) {                var con1 = setInterval(function () {                    if(flag == 1){                        clearInterval(con2)                        div1.style.left = div1.offsetLeft + 5+'px';                    }                },500);                var con2 = setInterval(function () {                     if(flag == 2) {                        clearInterval(con1)                        div1.style.left = div1.offsetLeft - 5+'px';                    }                },500);        }        butt.onclick = function () {            fun(1)        };        buttno.onclick = function () {          fun(2)        };3.另外我自己怀疑是不是作用域的原因，因为最开始我把if的判断是写在最外层的，包裹着两个计时器if(flag == 2) {                              var con2 = setInterval(function () {                    clearInterval(con1)                    div1.style.left = div1.offsetLeft - 5+'px';                },500);            }当时我把clearInterval（con1）写在 var con2 的前面 发现无法获取到con1 即我的编辑器显示con1为灰色字体，把clearInterval（con1）写在var con2下面时，编辑器即认可。所以这是为什么？两个问题哦~~~~鉴于大家说只要点击一次就会生成计时器这个我能理解，那我就把最开始我写的贴上 （即用 if判断 包裹）function fun(flag) {            if(flag == 1){                var con1 = setInterval(function () {                    clearInterval(con2)                    div1.style.left = div1.offsetLeft + 5+'px';                },500);            };            if(flag == 2) {                var con2 = setInterval(function () {                    clearInterval(con1)                    div1.style.left = div1.offsetLeft - 5+'px';                },500);            }        }        butt.onclick = function () {            fun(1)        };        buttno.onclick = function () {          fun(2)        };这种情况下依然无法清除计时器，这是为什么

Answer 1

每次触发事件之后，先生成了两个定时器，定时器内部进行的判断。判断不影响定时器的生成。