如何使子网页从父网页接收变量值？
如何使子网页从父网页接收变量值？
提问于 2019-06-09 16:06:11
对于我的学校项目，我正在创建一个具有门票预订服务的模拟电影院网站。目前我正在尝试创建座位选择部分。
我已经成功地做到了这一点，代码如何检测是否选择了一个座位是一个布尔值。(例如，如果他们选择了seat A1，名为"A1“的变量将被设置为true)，现在剩下的唯一部分就是将用户选择的选择详细信息转移到一个弹出的网页，在那里他们填写他们的”付款“详细信息。如何准确地将变量值传递给子网页？是否需要php文件？我是php的新手，所以我很感激一些指导。
我已经在网上搜索了一段时间(包括堆栈溢出)，但我找不到任何适合我的情况的正确代码
<html>
<body>
The on/off button:
<button onclick="press_button"><img id="button" src="on.png" style="width:100px"></button>
<BR>
The button that opens a new webpage:
<button onclick="confirm()"> Confirm</button>
<script language="JavaScript">
var i=0, status;
function press_button(){
i++;
if(i%2 == 1){
document.getElementById('button').src='off.png';
status=true
}
else
document.getElementById('button').src='on.png';
status=false
}
//function that changes the look of the button when it is on/off and records down whether it is on/off
function confirm(){
window.open("confirm.html")
//opens a new webpage
</script>
</body>
</html>为了简单起见，我制作了一个简单的网页，它有一个开/关按钮，我想要有一个确认按钮，它可以打开一个新页面，并根据开/关按钮的状态显示一条文本消息。有人能教我怎么做吗？
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-06-09 16:58:57
您可以单独使用JS来完成此任务，但也有许多其他方法。
<body>
<input type='text' value='defaultParamValue'>
<button type='button'>send param</button>
<script type='text/javascript'>
document.querySelector('button').onclick
= () => window.location.href
= 'destination.html?nameOfParam='
+ encodeURIComponent(document.querySelector('[type=text]').value)
</script>
</body>您可以使用PHP来实现这一点，它更现实、更实用。
<body>
<form action='destination.php' method='get'>
<input name='param' type='text' value='defaultParamValue>
<input type='submit'>
</form>
</body>这就是在destination.php中使用PHP检索值的方法。
$_POST['param'];以下是如何使用您自己的示例来完成此操作。
<body>
The on/off button:
<!-- you need to include type='button', otherwise it acts as type='submit' -->
<button type='button' onclick='press_button()'>
<img id='button' src='on.png' style='width:100px'>
</button>
<BR>
The button that opens a new webpage:
<!-- you need to include type='button', otherwise it acts as type='submit' -->
<button type='button' onclick='confirm()'> Confirm</button>
<script type='text/javascript'> // the language attribute is deprecated
var
i=0,
button=document.querySelector('button'),
status
function press_button(){
i++
if(i%2 == 1){
button.src='off.png'
status=true
}
else{ // you were missing a curly bracket
button.src='on.png'
status=false
}
} // you were missing a closing curly bracket
function confirm(){
if(status){
// window in window.open is a global variable
// which means it is always accessible
// and you do not need to include it
open(`confirm.html?status=${encodeURIComponent(status)}`)
}
} // you were missing a closing curly bracket
</script>
</body>组织代码可以更容易地发现代码中的问题(即缺少大括号)。
下面的JS将允许您在新页面上获取URL查询字符串参数。
const
urlParams = new URLSearchParams(location.search),
myParam = urlParams.get('status')
console.log(urlParams) // status=true/false
console.log(myParam) // true/false页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56512948
复制相关文章
相似问题