搜尋
首頁後端開發php教程javascript - 有沒有好的方法可以防止刷新頁面後js倒數不變

目前是可以實現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
絕對會話超時有什麼區別?絕對會話超時有什麼區別?May 03, 2025 am 12:21 AM

絕對會話超時從會話創建時開始計時,閒置會話超時則從用戶無操作時開始計時。絕對會話超時適用於需要嚴格控制會話生命週期的場景,如金融應用;閒置會話超時適合希望用戶長時間保持會話活躍的應用,如社交媒體。

如果會話在服務器上不起作用,您將採取什麼步驟?如果會話在服務器上不起作用,您將採取什麼步驟?May 03, 2025 am 12:19 AM

服務器會話失效可以通過以下步驟解決:1.檢查服務器配置,確保會話設置正確。 2.驗證客戶端cookies,確認瀏覽器支持並正確發送。 3.檢查會話存儲服務,如Redis,確保其正常運行。 4.審查應用代碼,確保會話邏輯正確。通過這些步驟,可以有效診斷和修復會話問題,提升用戶體驗。

session_start()函數的意義是什麼?session_start()函數的意義是什麼?May 03, 2025 am 12:18 AM

session_start()iscucialinphpformanagingusersessions.1)ItInitiateSanewsessionifnoneexists,2)resumesanexistingsessions,and3)setsasesessionCookieforContinuityActinuityAccontinuityAcconActInityAcconActInityAcconAccRequests,EnablingApplicationsApplicationsLikeUseAppericationLikeUseAthenticationalticationaltication and PersersonalizedContentent。

為會話cookie設置httponly標誌的重要性是什麼?為會話cookie設置httponly標誌的重要性是什麼?May 03, 2025 am 12:10 AM

設置httponly標誌對會話cookie至關重要,因為它能有效防止XSS攻擊,保護用戶會話信息。具體來說,1)httponly標誌阻止JavaScript訪問cookie,2)在PHP和Flask中可以通過setcookie和make_response設置該標誌,3)儘管不能防範所有攻擊,但應作為整體安全策略的一部分。

PHP會議在網絡開發中解決了什麼問題?PHP會議在網絡開發中解決了什麼問題?May 03, 2025 am 12:02 AM

phpsessions solvathepromblymaintainingStateAcrossMultipleHttpRequestsbyStoringDataTaNthEserVerAndAssociatingItwithaIniquesestionId.1)他們儲存了AtoredAtaserver side,通常是Infilesordatabases,InseasessessionIdStoreDistordStoredStoredStoredStoredStoredStoredStoreDoreToreTeReTrestaa.2)

可以在PHP會話中存儲哪些數據?可以在PHP會話中存儲哪些數據?May 02, 2025 am 12:17 AM

phpsessionscanStorestrings,數字,數組和原始物。

您如何開始PHP會話?您如何開始PHP會話?May 02, 2025 am 12:16 AM

tostartaphpsession,usesesses_start()attheScript'Sbeginning.1)placeitbeforeanyOutputtosetThesessionCookie.2)useSessionsforuserDatalikeloginstatusorshoppingcarts.3)regenerateSessiveIdStopreventFentfixationAttacks.s.4)考慮使用AttActAcks.s.s.4)

什麼是會話再生,如何提高安全性?什麼是會話再生,如何提高安全性?May 02, 2025 am 12:15 AM

會話再生是指在用戶進行敏感操作時生成新會話ID並使舊ID失效,以防會話固定攻擊。實現步驟包括:1.檢測敏感操作,2.生成新會話ID,3.銷毀舊會話ID,4.更新用戶端會話信息。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

Dreamweaver Mac版

Dreamweaver Mac版

視覺化網頁開發工具