问题描述

js中怎么让点击事件触发前移除定时器，等点击完后再继续执行，我做的是一个轮播器

 window.onload=function()
{
    var oPicList=document.getElementById("picList");
    var oCss=document.getElementById("css");
    var aBtns=document.getElementById("btns").getElementsByTagName("li");
    var aLi=null;
    var sLi="";
    var sCss="";
    var iLiw=300;
    var iZindex=0;
    var iLength=oPicList.clientWidth/iLiw;
    var iNow=0;
    var iLB=0;
    var c=1;
    for(var i=0;i<iLength;i++)
    {
        i>iLength/2?iZindex--:iZindex++;
        sLi+='<li><a href="#"></a><a href="#"></a><a href="#"></a><a href="#"></a><span></span><span></span></li>';
        sCss+="#picList li:nth-of-type("+(i+1)+") a{background-position:-"+i*iLiw+"px 0;}";
        sCss+="#picList li:nth-of-type("+(i+1)+"){z-index:"+iZindex+"}";
    }
    oPicList.innerHTML=sLi;
    oCss.innerHTML+=sCss;
    aLi=oPicList.children;
    for(var i=0;i<aBtns.length;i++){
        (function(a){
            aBtns[a].onclick=function()
            {
                clearInterval(LB);
                for(var i=0;i<aLi.length;i++)
                {
                    <!-->aLi[i].style.transition="1.5s "+i*200+"ms";
                    aLi[i].style.WebkitTransform="rotateX(-"+a*90+"deg)";
                }
                this.className="active";
                aBtns[iNow].className="";
                iNow=a;
            };
        })(i)

    }

        function scroll(){

        //自调用函数，相当于一个函数表达式，立即执行函数
        (function(b){

                    for(var i=0;i<aLi.length;i++)
                    {
                        <!-->aLi[i].style.transition="0.5s "+i*100+"ms";
                        aLi[i].style.WebkitTransform="rotateX(-"+b*90+"deg)";
                    }
                    this.className="active";

        })(c);

        c++;
    }
    var LB=setInterval(scroll,2000);
};

这是大概的代码，问题主要出在这，我下面继续重新定义个定时器也无效求怎么放这个重新定义的定时器；
    for(var i=0;i<aBtns.length;i++){
        (function(a){
            aBtns[a].onclick=function()
            {
                clearInterval(LB);
                for(var i=0;i<aLi.length;i++)
                {
                    <!-->aLi[i].style.transition="1.5s "+i*200+"ms";
                    aLi[i].style.WebkitTransform="rotateX(-"+a*90+"deg)";
                }
                this.className="active";
                aBtns[iNow].className="";
                iNow=a;
            };
            LB=setInterval(scroll,2000);
        })(i)

    }

解决方案

可以设一个boolean变量，，点击时设为false，，否则设为tue