使用带有Javascript的localStorage传递的只读信息（未嵌入在Hml中）

Question

我一直坚持这件事，任何帮助都将受到高度赞赏。 我想通过按下提交按钮使用localStorage将值从一个HTML页面传递到另一个HTML页面，这里是第一页的值

参考编号：TECS5

当值出现在第二页时，该值必须保持只读。 此外，我不能使用任何函数，如JQuery等，Javascript应该是一个单独的文件。干杯

Answer 1

这里有一些代码来演示可能的解决方案。使用以下功能，我们可以在表格中输入参考编号，并将其显示在另一页面上。

我们不使用JQuery，而是使用JavaScript函数getElementById（）。其余代码非常明显。如果您有任何问题，请告诉我们！

page1.html

<script src="saveToLocalStorage.js"></script>

<form onsubmit="return saveToLocalStorage()">
Enter reference number: <input id="reference" type="text">
<input type="submit">
</form>

page2.html

<div>Reference number : <span id="place"></span></div>

<script type="text/javascript">
// if you also want this JavaScript in a separate file, we can put it in a function
document.getElementById('place').innerHTML = localStorage.getItem("refNum");
</script>

saveToLocalStorage.js

function saveToLocalStorage() {
    var input = document.getElementById("reference");
    localStorage.setItem("refNum", input.value);
    window.location = "page2.html";
    return false;
}