使用 java 和 html 進行本地存儲

Question

我只是想使用本地存儲將計算結果從一個 html 文件獲取到另一個 html 文件，因為它以前對我有用，現在我似乎無法弄清楚。 我的目標是獲得在第一頁計算的存儲“結果”以顯示在第二頁上。

以下是腳本的代碼：

function run()
{
const testConst = 41;
var age = document.getElementById('age').value;
var weight = document.getElementById('weight').value;
var height = document.getElementById('height').value;
var result = (10*weight) + (6.25* height) - (5*age)+5;

document.getElementById('myDiv').innerHTML = "There should be text here and the number " + result + "!";
sessionStorage.setItem("storedResult", result)
document.getElementById('divResult').innerHTML = "Your BMR is " + sessionStorage.getItem("storedResult");

以下是“第一頁”的代碼，我們在這里獲取存儲計算的信息：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script defer src="script.js"></script>
    <title>Home</title>
</head>
<body>
    Age:<input type="text" id="age">
    Weight:<input type="text" id="weight">
    Height:<input type="text" id="height">
<br>

    <input type="submit" value="Submit" onclick="run();">

<br>
<br>
<div id="myDiv"></div>
<div id="divResult"></div>
</body>
</html>

以下是我試圖讓存儲的結果出現的頁面：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Results</title>
</head>
<body>
    <h1>You are on the second page</h1>
    <div id="divResult"></div>
</body>
</html>

結果頁面未鏈接時的第一頁是什么樣子，我相信存儲工作正常

結果頁面在鏈接時的樣子，應該有“你的 bmr 是……”這樣的文字。

感謝您的幫助。

Answer 1

這兩個 HTML 頁面是如何連接的？ 1. 通過頁面提交：page1 提交給服務器，然后服務器發送page2 2. 單頁申請

對於案例 1 '頁面提交' - 您可以將在 run() 上計算的“結果”捕獲到表單隱藏元素中，假設其名稱為“resultHidden”。 在服務器端將此值讀取為request.getParameter("resultHidden") 。 在第二頁上寫下這個變量。 我使用 JSP 將值寫入第二頁，您可能正在使用另一種技術。

對於案例 2 '單頁應用程序' - 在 run() 計算結果后，將其存儲在全局變量中，該變量是在 page1 和 page2 上導入的 JS 文件的一部分。 在 page2 上讀取這個 JS 變量並寫入 HTML。

對於這兩種情況，您也可以使用 cookie。 Js 可用於從 page1 寫入 cookie 並從 page2 讀取。 同樣，當 page1 提交給服務器時，可以在服務器端讀取 cookie。

使用 java 和 html 進行本地存儲

問題描述

1 個解決方案

解決方案1
2 已采納 2019-12-24 04:36:22

使用 java 和 html 進行本地存儲

問題描述

1 個解決方案

解決方案1 2 已采納 2019-12-24 04:36:22

解決方案1
2 已采納 2019-12-24 04:36:22