從HTML表單獲取值作為JavaScript變量

Question

我想捕獲通過表單從一個頁面發送到another.html頁面的輸入變量，並獲取這些值作為JavaScript變量。 可以做到這一點。

這是我的表格；

<form action='another.html' id='form' data-ajax='false'>
<input id='sent_by' value='tom'/>
<input type='submit' value='Submit'/>
</form>

在我的another.html中，我嘗試將值設為：

var sent_by = $.session.get("sent_by");

但是我無法獲得這些價值。 感謝所有幫助。

Answer 1

您可以使用瀏覽器的localStorage實現此目的。 在提交並轉到另一頁面之前，將表單的所有值存儲在localStorage中，您可以在另一頁面上訪問它：

Page1.html

字段名稱=“名稱” <input type="text" name="name" id="name" />

讀取值並將其存儲到localStorage

localStorage.setItem('name', document.getElementById('name').value);

等等。 您可以在JavaScript中創建一個函數，以便在提交之前將表單的所有字段保存在localStorage上。

要在另一頁上讀取這些值：

Page2.html鍵名存儲的值可以使用以下JavaScript獲取：

localStorage.getItem("name");

注意

page1.html和page2.html應該位於同一域中，以便您訪問localStorage。

在https://developer.mozilla.org/zh-CN/docs/Web/API/Storage/LocalStorage上了解有關本地存儲的更多信息

Answer 2

您是否嘗試過使用Window.localStorage ？ 它類似於sessionStorage但是沒有到期日期。 因此，請確保在瀏覽會話結束后將其清除。

Answer 3

我認為@Shakti Phartiyal提供的答案可能是最實用的，也是我可能添加的一個甜頭。 我寫這篇文章的主要原因是因為我也花了很長時間使用javascript傳遞此類信息。 這讓我感到困惑，因為您專用的javascript可以完成某些任務的PHP功能多么強大。 （是的，我知道有些JavaScript向導可以用它完成所有工作，我只是在談論基本編程。） 因此，如果您想知道PHP傳遞這種方式的方式：

您修改后的html表單：

<form action='another.html' id='form' data-ajax='false' method='post'>
<input id='sent_by' value='tom' name='uname'/>
<input type='submit' value='Submit'/>
</form>

然后在“ another.php”中，您可以從表單中檢索輸入：

<?php
$uname= htmlspecialchars($_POST['uname'];
?>

大。 但是如何使這個php變量變成javascript？ 啊，有趣的部分。 您將使用php將javascript寫入網頁-您可以執行以下操作：

var uname = "<?php echo $uname; ?>";