在 html 中显示值<input>来自 sessionStorage 的标签

Question

我正在使用 Javascript sessionStorage 方法将值从一个 HTML 页面传递到另一个页面。 我能够在第二页中获取值，但无法在文本框中显示它。 以下是我做过的代码

第 1 页：

<script>
function passvalue()
{
    var name = document.getElementById("myname").value;
    sessionStorage.setItem("textvalue",name);
    return false;
}
</script>

<form method="post" action="test2">
    <div class="form-group">
         <label for="myname">Name :</label>
         <input type="text" class="form-control" id="myname" placeholder="Enter Name...">
    </div>
  
    <input type="submit" value="Submit" onclick="passvalue();">
</form>

第2页：

<script>
    document.getElementById("result").innerHTML=sessionStorage.getItem("textvalue");
</script>

<div class="card" style="width: 18rem;">
    <div class="card-body">
        <label for="display">Name:</label>
        <input type="text" value="result" name="display" disabled>
    </div>
</div>

在第二页中，文本框的值始终显示为“结果”，而不是第一页中传递的名称。

Answer 1

在第二页中，您忘记将id设置为输入元素。

<div class="card" style="width: 18rem;">
    <div class="card-body">
        <label for="display">Name:</label>
        <input id="result" type="text" value="result" name="display" disabled>
    </div>
</div>

EDIT:

尝试删除value="result" <input id="result" type="text" name="display" disabled>并在加载事件后从文档中调用

document.addEventListener("DOMContentLoaded", function(event) {
  document.getElementById('result').value = sessionStorage.getItem('textValue');
});