美文网首页前端面试锦笈
JavaScript系列--防抖动

JavaScript系列--防抖动

作者: 小鱼儿的小世界 | 来源:发表于2018-05-01 11:20 被阅读0次

    网摘:https://www.cnblogs.com/fengzikuange/p/6150258.html
    https://www.cnblogs.com/Unknw/p/6689137.html
    https://blog.csdn.net/caopengflying/article/details/79120589

    防抖动,其核心内涵在于延迟处理

    点击发送验证码之后,摁扭变成不可点击状态,
    并且显示60秒动态倒计时,当time == 0时,摁扭重新变成可点击状态
    html代码:<button id="btn">发送验证码</button>
    js代码:

        let wait = 10;
        let btn = document.getElementById("btn");
        btn.onclick = function(){
            // time(this);
            var timer = setInterval(function(){
                if(wait == 0){
                    btn.removeAttribute("disabled",false);
                    btn.innerHTML = "重新发送验证码";
                    clearInterval(timer);
                }else{
                    btn.setAttribute("disabled",true);
                    btn.innerHTML = wait + "s";
                    wait--;
                }
            },1000);
        };
        /*
        function time(o){
            if(wait == 0){
                o.removeAttribute("disabled",false);
                o.innerHTML = "重新发送验证码";
                wait = 60;
            }else{
                o.setAttribute("disabled",true);
                o.innerHTML = wait + "s";
                wait--;
                setTimeout(function(){
                    time(o);
                },1000);
            }
        }*/
    

    感谢阅读我的文章,如有疑问或写错的地方,请不吝留言赐教

    相关文章

      网友评论

        本文标题:JavaScript系列--防抖动

        本文链接:https://www.haomeiwen.com/subject/tcyxrftx.html