更新時間:2018年01月10日14時46分 來源:傳智播客 瀏覽次數:
效果圖:
點擊前
點擊后
步驟一:
新建按鈕標簽,并起上類名
步驟二:
為按鈕寫上樣式;并且新建一個類名.code-time用作點擊按鈕后添加
步驟三:
引入JQ文件,JQ的版本不限。
步驟四:
在script標簽里新建變量,60為秒數,可根據個人情況更改;如要更改,下面的函數也要對應更改。
步驟五:
o為傳參使用;
進行判斷:
1.如果倒計時秒數為0;執(zhí)行當前按鈕解除點擊禁止;還原按鈕文字;去掉類名(背景顏色);時間變?yōu)?0秒
2.如果倒計時秒數不為0(也就是倒計時中);執(zhí)行當前按鈕添加類名(背景顏色);禁止按鈕點擊(以防用戶多次點擊產生BUG);按鈕文字變成倒計時數字;倒計時的秒數一秒減一;
步驟六:
為此按鈕寫上點擊事件,執(zhí)行函數,傳參為自己
所有代碼: