Javascript 如何从一个html表单获取数据并在另一个表单上显示？

我只使用JS，我想从一个html中获取用户名，并将其显示在另一个html页面上。我是编程新手，我有两个问题：

• 我可以只使用一个JS文件来执行此操作吗？如果是，如何进行

• 为什么它不起作用

首页

    <main>
        <form action="">
           <input type="text" name="login" id="login" class="login" placeholder="Login">
           <a href="password.html" id='logar'>LOGAR!</a>
        </form>
        <span id='spanlogin'></span>
    </main>
    <script src="main.js"></script>

第二页

    <main>
        <div>
            <span id='showlogin'></span>
        </div>
        <div class="senha">
        </div>
    </main>
    <script src="second.js"></script>

谢谢你的帮助

“对于从文件：URL加载的文档（即，直接从用户的本地文件系统在浏览器中打开的文件，而不是从web服务器上打开的文件），本地存储行为的要求未定义，并且在不同的浏览器中可能会有所不同

在所有当前浏览器中，localStorage似乎为每个文件：URL返回不同的对象。换句话说，每个文件：URL似乎都有自己独特的本地存储区域。但这种行为无法保证，因此您不应该依赖它，因为如上所述，对文件：URL的要求仍然没有定义。”

---

它来自developer.mozilla.org/en US/docs/Web/API/Window/localStorage

不管怎样，登录按钮只是一个链接，它没有在第一页运行js。当表单仍然为空时，js在页面加载时立即执行。如果您将其包装在函数中，并在单击时调用该函数，它将执行您想要的操作

你想要的，可能不是你需要的，但是让事情做我们想让他们做的，可以帮助我们更好地理解我们需要什么

main.js

function savePassword(){
    var login = document.getElementById('login').value;
    localStorage.setItem("thelogin", login);    
}

第一页：

<a href="password.html" id='logar' onclick="savePassword()">LOGAR!</a>

在回答你的第一个问题时，你只需要一页就可以做到。例如，阅读关于

---

请注意，您执行此操作的方式与。

传统方式不同：表单提交到服务器，服务器使用提交数据的新页面进行响应-备选方案：使用浏览器localStorage API-在MDNThanks上有很好的文档记录，但我如何以传统方式执行此操作？您的意思是向服务器端提交表单？通过向服务器端提交表单，我猜哦，我正在使用Opera GX来测试它。如果我换成Chrome，它可能会工作。谢谢你的帮助，我会尝试一下并给你反馈。@Hugofloloni如果你使用web服务器，本地存储将被共享。您将浏览到localhost:8000/filename.html，而不是单击该文件，这与访问普通网站相同，只是它位于您的本地计算机上。这是一个。是的，我使用VSCode的Open with Live Server选项，它在5500端口上打开文件。但它仍然不起作用cYeah，我只想显示用户名并将用户转移到另一个页面，输入密码，就像我正在复制的页面一样。谢谢你的帮助！

function savePassword(){
    var login = document.getElementById('login').value;
    localStorage.setItem("thelogin", login);    
}

<a href="password.html" id='logar' onclick="savePassword()">LOGAR!</a>