jQuery實作計時器功能詳解

這次帶給大家jQuery實作計時器功能詳解，jQuery實作計時器功能的注意事項有哪些，下面就是實戰案例，一起來看一下。

在寫專案的過程中遇到要前端60秒發送驗證碼的業務需求，於是用到計時器的功能：

setInterval(functionxxx(){
   //业务逻辑
},隔多少时间执行一次)

60秒計時思路：

1.設定秒數：60s
2、設定內容：即時改變，秒數內容
3、結束後：去掉按鈕的disable，內容恢復原本

//计时器60秒
functiontimeInterval(){
  $("#code_send_btn").html("60秒后重新获取邮箱验证码");
  vartimeSec = 59;
  vartimeStr ='';
  varcodeTime = setInterval(functionInternal(){
    if(timeSec == 0){
      $("#code_send_btn").html("获取邮箱注册码");
      $("#code_send_btn").removeAttr("disabled","disabled");
      clearInterval(codeTime);
      return;
    }
    timeStr ="("+timeSec+")获取邮箱注册码";
    $("#code_send_btn").html(timeStr);
    timeSec--;
  },1000);
}

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

canvas怎麼編輯操作圖像

#js如何設定禁止表單重複提交

以上是jQuery實作計時器功能詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！