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

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