js實現(xiàn)n秒倒計時后才可以點擊的效果

更新時間：2015年12月20日 09:02:36 投稿：lijiao

這篇文章主要介紹了js點擊按鈕在倒計時后才可以點擊的效果,需要的朋友可以參考下

在我們進行注冊用戶時經(jīng)常遇到點擊按鈕后，60秒倒計時后才能繼續(xù)可以點擊，按鈕上還能顯示倒計時，這60秒時間就是為大家提供”細閱讀協(xié)議“做準備的，這種功能是如何實現(xiàn)的，下面為大家分享詳細代碼。

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>倒計時然后才可以點擊效果代碼</title> 
<script type="text/javascript">
var s=4;
function countsub()
{
 var btnReg=document.getElementById("btnReg");
 if(btnReg)
 {
 if(s<=0)
 {
  btnReg.value="同意";
  btnReg.disabled=false;
  clearInterval(id);
 }
 else
 {
  btnReg.value="請仔細閱讀協(xié)議(還剩"+s+"秒)";
  s--;
 }
 }
}
var id = setInterval('countsub()',1000)
</script>
</head>
<body>
<textarea>注冊協(xié)議</textarea>
<input id="btnReg" type="button" value="同意" disabled="true" />
</body>
</html>

希望本文所述對大家學習javascript程序設計有所幫助。

您可能感興趣的文章:

js
倒計時

JavaScript中常見加密解密方法總結
這篇文章主要為大家詳細介紹了JavaScript中常見加密解密方法的實現(xiàn)，文中的示例代碼講解詳細，具有一定的學習價值，感興趣的小伙伴可以了解一下
2023-03-03
用p5.js制作煙花特效的示例代碼
本篇文章主要介紹了用p5.js制作煙花特效的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2018-03-03
bootstrap-table后端分頁功能完整實例
這篇文章主要介紹了bootstrap-table后端分頁功能,結合完整實例形式分析了bootstrap-table后端請求、數(shù)據(jù)分頁功能具體步驟與實現(xiàn)技巧,需要的朋友可以參考下
2020-06-06
Bootstarp在pycharm中的安裝及簡單的使用方法
這篇文章主要介紹了Bootstarp在pycharm中的安裝及簡單的使用方法,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下
2019-04-04
JavaScript?中的單例內置對象Global?與?Math
這篇文章主要介紹了JavaScript?中的單例內置對象Global與Math，文章圍繞主題展開詳細的內容介紹，具有一定的參考價值，需要的小伙伴可以參考一下
2022-07-07
如何用JS判斷兩個數(shù)字的大小
在JS的學習中,我們經(jīng)?？赡芘龅竭@樣的問題，本文用實例演示如何正確的用JS判斷兩個數(shù)字的大小。
2016-07-07
微信小程序功能函數(shù)小結(手機號驗證*、密碼驗證*、獲取驗證碼*)
這篇文章主要介紹了微信小程序功能函數(shù)手機號驗證、密碼驗證，獲取驗證碼*的相關代碼，非常不錯，具有參考借鑒價值,需要的朋友可以參考下
2017-12-12
JS實現(xiàn)點擊li標簽彈出對應的索引功能【案例】
這篇文章主要介紹了JS實現(xiàn)點擊li標簽彈出對應的索引功能,結合具體實例形式分析了javascript事件響應、元素遍歷等相關操作技巧,需要的朋友可以參考下
2019-02-02
JavaScript保留關鍵字匯總
本篇文章是小編日常收集整理些javascript保留關鍵字相關知識匯總，需要的朋友參考下
2015-12-12
uniapp表單驗證方法詳解
From表單組件具有數(shù)據(jù)收集、提交數(shù)據(jù)的功能,某種程度上說它就是一個容器,下面這篇文章主要給大家介紹了關于uniapp表單驗證的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
2022-10-10