javascript - 如何在page2 input上显示page1中的输入值?

标签 javascript jquery html input local-storage

如何在page2 input上显示page1中的输入值? Javascript

<script language="JavaScript">
function showInput() {
    var value =  document.getElementById("user_input").value;  
    document.getElementById('display').value = value;

}
</script>

第 1 页 html

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
</head>
<body>

    <form>
        <label><b>Enter a Message</b></label>
        <input type="text" name="message" id="user_input">
    </form>

    <input type="submit" onclick="showInput();"><br />
</body>
</html>

第 2 页 html

<html>
<head></head>
<body>
    <label>Your input: </label>
    <p><input id='display'> </p>
</body>
</html>

我需要使用本地存储吗?如何使用它? 把这个放在 page1

localStorage.setItem(id, value);

第 2 页中的这个?

localStorage.getItem(id);

如何显示输入中的值? 有人可以告诉我一些例子吗?谢谢。

最佳答案

试试这个:

page1.html

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script language="JavaScript">
function showInput() {
    var value =  document.getElementById("user_input").value;   // get value of message
    localStorage.setItem('val',value); // set value of message in local storage
}
</script>
</head>
<body>

    <form action="page2.html" method="post"> // add action and method attributes in form tag
        <label><b>Enter a Message</b></label>
        <input type="text" name="message" id="user_input">
        <input type="submit" onclick="showInput();"><br />
    </form>
</body>
</html>

page2.html

<html>
<head>
<script language="JavaScript">
function showInput() {
    var value = localStorage.getItem('val'); // get value of message from localstorage
    document.getElementById('display').value = value; // set it value to display input
}
</script>
</head>
<body onload="showInput();">
    <label>Your input: </label>
    <p><input id='display'> </p>
</body>
</html>

关于javascript - 如何在page2 input上显示page1中的输入值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37452989/

相关文章:

javascript - javascript中的验证表单,单独点击输入

javascript - 如何在javascript中获取未知元素ID

javascript - 公牛上的槽和奶头 HTML 模板

javascript - 具有不同语言选项的数据对象。 Javascript 实现

javascript - 将字符串从 HTML 发送到 jQuery 时,jQuery 删除撇号后的字符

javascript - 如何使用 JSON 在谷歌地图中制作动态标记?

javascript - 单击时突出显示图像,然后选中单选按钮

html - 当图像宽度远小于其高度时背景覆盖网页

javascript - 有没有办法在文本后添加伪元素

javascript - 你如何创建一个功能组件来更新 Redux store 的变化?