簡體   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