猿问

如何让子网页从父网页接收变量值?

对于我的学校项目,我正在创建一个具有票务预订服务的模拟电影网站。目前我正在尝试创建座位选择部分。


我已经成功地做到了这一点,并且代码如何检测是否已选择座位是一个布尔值。(例如,如果他们选择座位 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>

为简单起见,我制作了一个简单的网页,它有一个开/关按钮,我想要一个确认按钮来打开一个新页面并根据开/关按钮的状态显示一条文本消息。谁能教我怎么做?


四季花海
浏览 125回答 1
1回答

富国沪深

您可以单独使用 JS 来完成此操作,但还有许多其他方法。<body>&nbsp; <input type='text' value='defaultParamValue'>&nbsp; <button type='button'>send param</button>&nbsp; <script type='text/javascript'>&nbsp; &nbsp; document.querySelector('button').onclick&nbsp; &nbsp; = () => window.location.href&nbsp; &nbsp; = 'destination.html?nameOfParam='&nbsp; &nbsp; + encodeURIComponent(document.querySelector('[type=text]').value)&nbsp; </script></body>你可以用PHP来做到这一点,更现实和实用。<body>&nbsp; <form action='destination.php' method='get'>&nbsp; &nbsp; <input name='param' type='text' value='defaultParamValue>&nbsp; &nbsp; <input type='submit'>&nbsp; </form></body>这就是您使用 PHP 在 处检索值的方式destination.php。$_POST['param'];以下是如何使用您自己的示例进行操作。<body>&nbsp; The on/off button:&nbsp; <!-- you need to include type='button', otherwise it acts as type='submit' -->&nbsp; <button type='button' onclick='press_button()'>&nbsp; &nbsp; <img id='button' src='on.png' style='width:100px'>&nbsp; </button>&nbsp; <BR>&nbsp; The button that opens a new webpage:&nbsp; <!-- you need to include type='button', otherwise it acts as type='submit' -->&nbsp; <button type='button' onclick='confirm()'> Confirm</button>&nbsp; <script type='text/javascript'> // the language attribute is deprecated&nbsp; &nbsp; var&nbsp; &nbsp; &nbsp; i=0,&nbsp; &nbsp; &nbsp; button=document.querySelector('button'),&nbsp; &nbsp; &nbsp; status&nbsp; &nbsp; function press_button(){&nbsp; &nbsp; &nbsp; i++&nbsp; &nbsp; &nbsp; if(i%2 == 1){&nbsp; &nbsp; &nbsp; &nbsp; button.src='off.png'&nbsp; &nbsp; &nbsp; &nbsp; status=true&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; else{ // you were missing a curly bracket&nbsp; &nbsp; &nbsp; &nbsp; button.src='on.png'&nbsp; &nbsp; &nbsp; &nbsp; status=false&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; } // you were missing a closing curly bracket&nbsp; &nbsp; function confirm(){&nbsp; &nbsp; &nbsp; if(status){&nbsp; &nbsp; &nbsp; &nbsp; // window in window.open is a global variable&nbsp; &nbsp; &nbsp; &nbsp; // which means it is always accessible&nbsp; &nbsp; &nbsp; &nbsp; // and you do not need to include it&nbsp; &nbsp; &nbsp; &nbsp; open(`confirm.html?status=${encodeURIComponent(status)}`)&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; } // you were missing a closing curly bracket&nbsp; </script></body>构建代码可以更容易地发现代码中的问题(即缺少大括号)。下面的 JS 将允许您在新页面上获取 URL 查询字符串参数。const&nbsp; urlParams = new URLSearchParams(location.search),&nbsp; myParam = urlParams.get('status')console.log(urlParams) // status=true/falseconsole.log(myParam) // true/false
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答