首頁  >  文章  >  後端開發  >  javascript - 有沒有好的方法可以防止刷新頁面後js倒數不變

javascript - 有沒有好的方法可以防止刷新頁面後js倒數不變

WBOY
WBOY原創
2016-08-08 09:06:461605瀏覽

目前是可以實現js的倒數計時,但是,頁面一刷新,倒數計時要麼直接停止,要麼直接重新開始。
那麼問題來了?
怎麼能控制住js,即使刷新頁面,那個倒數計時還是持續的。
麻煩各位路過的小夥伴,幫個忙。謝謝!

回覆內容:

目前是可以實現js的倒數計時,但是,頁面一刷新,倒數計時要麼直接停止,要麼直接重新開始。
那麼問題來了?
怎麼能控制住js,即使刷新頁面,那個倒數計時還是持續的。
麻煩各位路過的小夥伴,幫個忙。謝謝!

開始倒數計時的時候獲取本地時間,存入cookie或localstorage,刷新後讀取開始的時間和現在的時間想減

了解Service Worker

每次刷新都是新的函數運作環境,無法得知刷新之前的狀態。你的定時器的開始時間只能從後台取得或根據當前時間計算。

用cookie或localstorage,
具體見我寫過的一篇回答
http://stackoverflow.com/a/38...

<code>1 php: 定义停止$end_time 
2 html : <input type="hidden" name="end_time" id="end_time" value="$end_time">
3 js:$("#end_time").val()
</code>

應該看得懂意思把

倒數計時開始時,保存結束時間到localstorage,刷新頁面讀取localstorage的值再計算出倒數計時

最近老有人問倒數計時的問題,之前寫過一個簡單的了,樓主可以看看

求到每週二的一個倒數碼

你倒數的開始時間不要用js獲取客戶端的時間,用php獲取服務端的時間給js用試試看

寫一個本地儲存倒數就ok啦

要實現一個倒數功能,首先你必須得有一個固定的結束時間,正常邏輯實現:

把結束時間傳入到一個倒數計時方法裡面,使用結束時間減去當前時間,得到剩餘時間,一秒鐘執行一次。而當前時間會增加,那麼剩餘時間就會隨之減少。

那麼固定結束時間從哪裡來的。 1、程式碼裡面寫死的時間 2、後端回傳的時間 3、本地儲存的。只要拿到了固定的結束時間,倒數計時就不會從頭開始。中斷也只是在倒數結束或程式碼報錯的情況下出現。我寫過一個多個倒數同時存在的頁面連結描述

如果非要前端控制只能利用cookie/Web storage之類的瀏覽器存儲,這樣的話在同一個瀏覽器不清除緩存的情況下可以實現你的需求,如果需要即使更換瀏覽器也保持不變的話只能後端回傳時間

【發送簡訊驗證,後鈕倒數計時,防止刷新倒數失效】
應用場景 ,在開發「發送簡訊驗證」功能時候,要解決一個問題,防止惡意或頻繁發送簡訊驗證碼問題。一般原理是「當點擊發送按鈕時,發送ajax請求到伺服器發送短信驗證碼,成功則把發送按鈕設置為不可點擊,並且調用定,原文鏈接:https://segmentfault.com/a/11.. .

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn