首頁 >web前端 >js教程 >如何在無狀態 HTTP 環境中跨頁面載入保留變數?

如何在無狀態 HTTP 環境中跨頁面載入保留變數?

Barbara Streisand
Barbara Streisand原創
2024-12-24 09:39:13429瀏覽

How Can I Persist Variables Across Page Loads in a Stateless HTTP Environment?

在頁面載入之間保留變數

HTTP 是無狀態的,跨頁面重新載入保留值需要外部儲存。以下是克服此限制的方法:

查詢字串

透過 GET 提交表單時,查詢字串 (?parameter=value) 攜帶表單欄位資料。對應設定隱藏欄位的值:

<form method="GET">
    <input type="hidden" name="clicked" value="true" />
    <input type="submit" />
</form>

頁面載入時,擷取查詢參數:

function getParameterByName(name) {
    var regex = new RegExp("[\?&amp;]" + name + "=([^&amp;#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

var clicked = getParameterByName('clicked');

Web Storage

HTML5 提供Web 存儲,允許基於瀏覽器的資料存儲。 SessionStorage 僅在當前瀏覽會話期間存儲數據:

sessionStorage.setItem('clicked', 'true');

頁面加載時,檢索存儲的值:

var clicked = sessionStorage.getItem('clicked');

Cookies

Cookie 主要用於伺服器端資料存儲,但也可用於客戶端儲存。 jQuery 簡化了cookie 管理:

$.cookie('clicked', 'true', {expires: 1}); // expires in 1 day

要在頁面載入時讀取cookie:

var clicked = $.cookie('clicked');

請記得在不再需要時取消設定cookie:

$.cookie('clicked', null);

Window.name

雖然不是推薦,window.name

window.name = "my value";

雖然不是推薦,window.name 可以跨頁面刷新甚至跨域存儲字符串:

var value = window.name;
頁面加載時,訪問存儲的值:

以上是如何在無狀態 HTTP 環境中跨頁面載入保留變數?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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