我有两个 HTML 页面:form.html 和 display.html。在form.html中,有一个表单:
<form action="display.html">
<input type="text" name="serialNumber" />
<input type="submit" value="Submit" />
</form>
表单数据被发送到 display.html。我要显示和使用表单数据serialNumber
在display.html中,如下图:
<body>
<div id="write">
<p>The serial number is: </p>
</div>
<script>
function show() {
document.getElementById("write").innerHTML = serialNumber;
}
</script>
</body>
那么我怎样才能通过 serialNumber
从 form.html 到 display.html 的变量,以便 display.html 中的上述代码将显示序列号,JavaScript 函数 show() 获取 serialNumber
从第一个 HTML 开始?
最佳答案
如果您无法选择使用服务器端编程,例如 PHP,您可以使用查询字符串或 GET 参数。
在表单中,添加一个method="GET"
属性:
<form action="display.html" method="GET">
<input type="text" name="serialNumber" />
<input type="submit" value="Submit" />
</form>
当他们提交此表单时,用户将被定向到一个包含 serialNumber
值作为参数的地址。像这样的东西:
http://www.example.com/display.html?serialNumber=XYZ
然后您应该能够使用 window.location.search
值从 JavaScript 解析查询字符串 - 它将包含 serialNumber
参数值:
// from display.html
document.getElementById("write").innerHTML = window.location.search; // you will have to parse
// the query string to extract the
// parameter you need
另一种方法是在提交表单时将值存储在 cookie 中,并在 display.html
页面加载后再次从 cookie 中读取它们。
关于javascript - 将表单数据传递到另一个 HTML 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14693758/