Question

美好的一天，我有两页php文件和一个外部javascript文件。我想将选定的单选按钮的值传递给jquery全局变量，以便我可以查看与所选单选按钮的值具有相同id的div元素。每当我点击PLAY!按钮时，我都不会在下一页看到我的div元素。这是我的代码：

player-choose.php脚本：

<head>
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/mycustom.js"></script>
</head>

<body>
<div id="player-list">
    <input type="radio" name="player" value="fighter" id="fighter-radio"><label for="fighter-radio"><img src="images/heroes/fighter-01.png" width="74" height="70"></label>
    <input type="radio" name="player" value="pakhi" id="pakhi-radio"><label for="pakhi-radio"><img src="images/heroes/pakhi.png" width="95" height="70"></label>
</div>
<button id="play">PLAY!</button>
</body>

mycustom.js脚本：

var playerID;

function start(){
spawnhero();
}

$(function(){
$("#play").click(function(){     
    window.location.href = 'index.php';
    playerID = $('input[name=player]:checked').val();

});
})

function spawnhero () {
$("#content").append($("<div>").attr('id', playerID));
}

index.php脚本：

<head>
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/mycustom.js"></script>
</head>

<body onload="start()">
<div id="content">
<div id="galaxy"></div> 
</div>
</body>

这是一件非常简单的事情，但我不知道为什么它不起作用。我在这里做错了吗？如果有人找到解决方案，请启发我。 TNX！

Answer 1

全局变量在页面中不是持久的。加载index.php后，它将具有新的全局范围（窗口变量）。

我建议传递一个参数。

$("#play").click(function(){
    playerID = $('input[name=player]:checked').val();    
    window.location.href = 'index.php?id=' + playerID;

});

之后，在index.php脚本中，读取参数并进行相应的分配。

Answer 2

如果您要移动到新页面（window.location = ...），您需要一些稍微复杂的方法在这些页面之间传输信息 - 大多数情况下，HTTP / HTML除了像cookies之类的技术之外，它是无状态的＃34; JavaScript变量完全消失 - 它实际上在每个新页面上重新解析整个JQuery库（并不是说要避免的事情）

对于视频游戏，只要玩家信息不包含服务器组件（我可能错了），我的建议就是在sessionStorage中保存玩家信息。

https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage

但是，如果这是一款基于服务器的游戏，您选择的玩家比本地计算机更重要，那么您可能希望通过不同地构建页面请求来将玩家ID发送到服务器： / p>

window.location.href = 'index.php?playerId=' + playerId;

或者POST将数据作为表单;最简单的方法是将提交按钮结构化为<input type="submit">，并将所有<input>元素包装在<form method="POST">对象中。

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

从那里，您的服务器软件可以根据给定的信息以不同的方式编写第二页的响应 - 您甚至可以使用PHP指令自定义在<script>标记内编写的JavaScript。

var playerId = "<?php print($_POST['playerId']); ?>";

希望这有助于您入门。

Answer 3

替代解决方案是您可以使用JavaScript或jQuery cookie或localstorage。您可以跨页面加载/重定向获取/设置值，但这些值不会传递给服务器。

jQuery Cookie

var playerID = $('input[name=player]:checked').val();
$.cookie("playerId", playerID);

localStorage的

var playerID = $('input[name=player]:checked').val();
localStorage.setItem("playerId", playerID);

函数变量不传递给全局变量

3 个答案:

jQuery Cookie

localStorage的