jq實現發送短信驗證碼

 

前端的工作經常會涉及到短信驗證的功能(注冊或獲取當前手機號信息),於是自己也寫了一個,路過的小伙伴可以看一下

未點擊狀態

點擊之后的狀態

 

var timer="";
var nums=60;
var validCode=true;//定義該變量是為了處理后面的重復點擊事件
$("#getCode").on('click',function(){
            console.log("111");
            var code=$(this);
            if(validCode){
                validCode=false;
                timer=setInterval(function(){
                    if(nums>0){
                        nums--;
                        code.text(nums+"秒后重新發送");
                        code.addClass("gray-bg");
                    }
                    else{
                        clearInterval(timer);
                        nums=60;//重置回去
                        validCode=true;
                        code.removeClass("gray-bg");
                        code.text("發送驗證碼");
            }
                },1000)
            }
            

        })