在许多 Web 应用程序中，我们需要从一个 HTML 页面收集表单数据，然后将其传递到另一个 HTML 页面进行处理。这篇文章将介绍如何使用 JavaScript 和 jQuery 在两个不同的页面之间传递表单数据。
使用 GET 方法传递表单数据
GET 方法可以将表单数据作为 URL 的查询字符串发送到另一个页面。通过将表单数据附加到 URL 上，接收页面就可以从 URL 中提取这些数据。下面是一个示例 HTML 表单：
------ ------ ------------------------ ------ ----------- --------- -------------------- ------ -------------------------- ------ ------------ ---------- --------------------- ------- ----------------------------- -------
当用户提交表单时，可以使用 JavaScript 将表单数据附加到 URL 上，并在新页面中使用该数据。以下是示例代码：
-------------------------------- - ----------------------- -- -------- ----- -------- - -------------------- -- --------- --- ------ -------------------- - ---------------- - --------- -- ------------- ---
接下来，在新页面中，您可以使用以下代码从 URL 中提取表单数据：
----- --------- - --- ---------------------------------------- -- ----------- ----- ---- - ---------------------- -- ------------- ----- ----- - -----------------------
使用 POST 方法传递表单数据
相比于 GET 方法，POST 方法可以更安全地传递敏感表单数据，因为它将数据放在 HTTP 请求的正文部分而不是 URL 上。以下是示例 HTML 表单：
----- ------------- ------ ------------------------ ------ ----------- --------- -------------------- ------ -------------------------- ------ ------------ ---------- --------------------- ------- ----------------------------- -------
当用户提交表单时，可以使用 JavaScript 发送一个 POST 请求，并在新页面中使用该数据。以下是示例代码：
-------------------------------- -
----------------------- -- --------
----- -------- - -------------------- -- --------- --- ------
----------------------- --------- ------------------ -
---------------------- -- ---------
---
---在接收页面（new-page.html）中，您可以使用以下代码从 POST 请求正文中提取表单数据：
----- ---- - -------------- -- - ---- ----------- ----- ----- - ---------------
结论
通过使用 GET 或 POST 方法，可以将表单数据从一个 HTML 页面传递到另一个 HTML 页面。这些方法都有自己的优缺点，因此您应该选择最适合您的应用程序的方法。在使用这些技术时，请务必考虑安全性和输入验证。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/27487