您好,登錄后才能下訂單哦!
本篇文章為大家展示了怎么在JavaScript中使用jQuery實現一個用戶注冊協議倒計時功能,內容簡明扼要并且容易理解,絕對能使你眼前一亮,通過這篇文章的詳細介紹希望你能有所收獲。
方法一:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>www.jb51.net 注冊倒計時</title> <script type="text/javascript"> //用戶有十秒鐘的時間看協議,超過十秒鐘,“同意”按鈕將生效 var Seconds = 10; //計時器ID var setIntervalID; function ok() { var getid = document.getElementById("but"); if (Seconds <= 0) { getid.value="同意"; getid.disabled = false; //或者寫成getid.disabled=""; 啟用getid控件。 //停止計時器 clearInterval(setIntervalID); } else { getid.value = "請仔細閱讀協議還剩下【" + Seconds + "】秒"; } Seconds--; } setIntervalID=setInterval("ok()", 1000); </script> </head> <body> <textarea cols="20" rows="8"></textarea><br /> <!--disabled="disabled" 默認submit表單是禁用的,也就是只讀的,不能點擊--> <input type="submit" id ="but" value="同意" disabled="disabled" /> </body> </html>
運行效果:
方法二:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>www.jb51.net 注冊倒計時</title> <script src="jquery-1.7.2.min.js"></script> </head> <body> <form action="https://www.jb51.net/" method="post" name="agree"> <input type="submit" class="button" value="" name="agreeb"> </form> </body> </html> <script> var secs = 5; var si; $(function () { $(".button").attr("disabled", "disabled"); $(".button").val("請認真查看<服務條款和聲明>(" + secs + ")") si = setInterval(a, 1000); }) function a() { $(".button").val("請認真查看<服務條款和聲明>(" + (secs-1) + ")"); if (secs == 0) { clearInterval(si); $(".button").val("我同意" ).removeAttr("disabled"); } secs--; } </script>
運行效果:
方法三:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>www.jb51.net 注冊倒計時</title> </head> <body> <form action="https://www.jb51.net/" method="post" name="agree"> <input type="submit" class="button" value="請認真查看<服務條款和聲明> (30)" name="agreeb"> </form> </body> </html> <script> var secs = 30; document.agree.agreeb.disabled = true; for (var i = 1; i <= secs; i++) { window.setTimeout("update(" + i + ")", i * 1000); } function update(num) { if (num == secs) { document.agree.agreeb.value = " 我 同 意 "; document.agree.agreeb.disabled = false; } else { var printnr = secs - num; document.agree.agreeb.value = "請認真查看<服務條款和聲明> (" + printnr + ")"; } } </script>
上述內容就是怎么在JavaScript中使用jQuery實現一個用戶注冊協議倒計時功能,你們學到知識或技能了嗎?如果還想學到更多技能或者豐富自己的知識儲備,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。