Home  >  Article  >  Web Front-end  >  js uses setInterval to implement countdown

js uses setInterval to implement countdown

大家讲道理
大家讲道理Original
2016-11-10 13:22:011228browse

利用setInterval制作简单的js倒计时,点击按钮将触发定时器且按钮不可用


html:

<button id="code" class="btn btn-default" onclick="getCode();">获取校验码</button>

JS:

<script type="text/javascript">  
    var i;  
    function getCode(){  
        $("#code").attr({"disabled":"disabled"});  
        i = self.setInterval("countdown()", 1000);  
    }  
   
    var int = 10  
    function countdown() {  
        document.getElementById("code").innerHTML = int + "秒后重新发送";  
        int--;  
        if(int<0){  
            i=window.clearInterval(i)//结束  
            int = 10; //重新赋值  
            $("#code").removeAttr("disabled").html("重新获取校验码");//将按钮可用  
        }  
    }  
       
</script>


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn