繁体   English   中英

如何在提交表单后 go 到新页面,并让新页面显示来自表单的处理信息?

[英]How can I go to a new page after a form is submitted, and have the new page display processed information from the form?

我的实际代码有点复杂,但为了简化我的问题,基本上就像我有一个文本框询问用户的姓名,一旦他们按下提交,我希望他们被重定向到一个新页面,上面写着“谢谢你 _________”,空白处就是他们在之前的表格中提交的姓名。

截至目前,在他们按下提交后,他们停留在同一页面上,一旦按下提交,文本框下方就会出现一个段落,并说“谢谢你______”

我通过设置“var name = document.getElementById("myText").value”来存储用户在文本框中输入的任何值"到那个页面。

这是我所说的代码,因此您可以对其进行测试并了解我的意思。 一旦按下提交按钮,我希望有一个新页面显示“谢谢____”,但我不知道如何将文本框的值转移到新页面上。

 .container2 > * { vertical-align:top; } textarea { border: 3px solid #FF9333; resize: none; height: 30px; width: 300px; } textarea:focus{ border: 3px solid #E86D00; outline: none; } button { height: 30px; width: 70px; color: #FFFFFF; background-color: #FF7800; border-left: 2px solid #DCDCDC; border-top: 2px solid #DCDCDC; border-bottom: 2px solid #ADADAD; border-right: 2px solid #ADADAD; outline: none; } button:hover { background-color: #E86D00; cursor: pointer; } button:active { text background-color: #FF8315; border-right: 2px solid #DCDCDC; border-bottom: 2px solid #DCDCDC; border-top: 2px solid #ADADAD; border-left: 2px solid #ADADAD; }
 <body> <div class = "container2"><textarea placeholder = "Enter name here" style = "margin-right: 10" type="textarea" id="myText"></textarea> <button id = "submit" onclick="getName();">Submit</button></div> <p id = "result"></p> <script> var name; function getName() { name = document.getElementById("myText").value; document.getElementById("result").innerHTML = "Thank you, " + name; } </script> </body>

在代码中,我通过将变量“name”设置为“document.getElementById(“myText”).value”来存储提交的值,因此如果用户被定向到新页面,则“name = document.getElementById(” myText").value" 仍然有效吗? 我对如何将文本框的值存储在一个也可以在另一个页面中使用的变量中感到困惑。 它仅取决于变量“名称”是全局的还是局部的? (我所有的代码都在 Notepad++ 中)。

注意:我知道我可以在按下提交按钮后折叠文本框,通过将显示设置为无,但我的实际代码有点复杂,所以如果我可以只 go 到新页面会更容易。

您可以将名称作为 URL 参数传递:www.yoursite.com/?username=Anika

并在你的 JS 中使用它:

const queryString = window.location.search const urlParams = new URLSearchParams(queryString) const username = urlParams.get('username')

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM