本文實例講述了jQuery實現簡單的計時器功能。分享給大家供大家參考,具體如下:
在寫項目的過程中遇到要前端60秒發送驗證碼的業務需求,于是用到計時器的功能:
setInterval(function xxx(){ //業務邏輯},隔多少時間執行一次)60秒計時思路:
1、設置秒數:60s
2、設置內容:實時改變,秒數+內容
3、結束后:去掉按鈕的disable,內容恢復原來樣子
//計時器60秒function timeInterval(){ $("#code_send_btn").html("60秒后重新獲取郵箱驗證碼"); var timeSec = 59; var timeStr = ''; var codeTime = setInterval(function Internal(){ 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);}PS:這里再為大家推薦幾款相關的在線工具供大家參考:
在線秒表工具:
http://tools.Vevb.com/bianmin/miaobiao
Unix時間戳(timestamp)轉換工具:
http://tools.Vevb.com/code/unixtime
更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery日期與時間操作技巧總結》、《jQuery擴展技巧總結》、《jQuery常見經典特效匯總》、《jquery選擇器用法總結》及《jQuery常用插件及用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
新聞熱點
疑難解答
圖片精選