Question

冗长的媒介我正在涉足一些HTML / PHP / JS，而且事情进展顺利。我正在制作一个模拟游戏，我正在制作一个游戏地图。拿1是绘制地图服务器端并将其传递给客户端每个页面加载，现在我正在尝试使用HTML5画布和客户端javascript来处理绘图。

我希望能够让用户能够点击地图，并使用从数据库中检索到的有关他们点击的网格内容的信息来加载新页面。使用服务器端方法，我使用服务器端映射来传递点击坐标，并使用一些简单的数学计算出他们点击的网格。

我或多或少地从画布上的mousedown侦听器获取了点击坐标，但现在我正在尝试使用相同的函数更新导航表单，然后使用javascript加载页面。表格有效（如果我输入-1，-1进入x / y坐标字段并单击go，我得到有关网格-1，-1的信息，但点击网格-1，-1不能正确传递POST变量（页面确实刷新了，但检查POST变量的脚本部分（php）找不到任何内容，但如果单击go按钮就会找到它们。

画布和表格如下：

<div id="scrollable">
	<canvas id="gameCanvas" width="<?php echo $max ?>" height="<?php echo $max ?>"></canvas><br/>
</div>
<div>
	<form id="gamenavform" action="game2.php" method="post">
		X Coord: <input id="gamenavx" type="text" name="xcoord" size="2" /><br/>
		Y Coord: <input id="gamenavy" type="text" name="ycoord" size="2" /><br/>
		<input type="submit" name="mapnav" value="Go" />
	</form>
</div>

javascript的相关部分如下：

<script>
document.addEventListener("DOMContentLoaded", init, false);
	
function init() {
	var canvas = document.getElementById("gameCanvas");
	var ctx = canvas.getContext("2d");
	ctx.fillStyle = "#FF0000";
	ctx.fillRect(0,0,99999,99999);
	canvas.addEventListener("mousedown", getPosition, false);
}

function getPosition(event) {
// long function snipped
	var navx = document.getElementById("gamenavx");
	var navy = document.getElementById("gamenavy");
	navx.value = Math.floor(x/64) - <?php echo $gameInfo[1] ?>;
	navy.value = Math.floor(y/64) - <?php echo $gameInfo[1] ?>;
	document.getElementById("gamenavform").submit();
}
</script>

为了完整起见，检查POST变量的PHP部分如下所示：

if(isset($_POST['mapnav'])) {
	$coords[0] = $_POST['xcoord'];
	$coords[1] = $_POST['ycoord'];
}
else {
	$coords[0] = 0;
	$coords[1] = 0;
}

单击画布时，导航字段会更改为相应的坐标，但是当页面加载时，它们会显示为默认的0,0，就好像它是一个没有POST值的新页面加载一样。当我在“if（isset（$ _ POST ['mapnav']）之后插入调试代码”时，如果我通过在导航表单上实际单击“go”到达页面，我只评估为true，而不是单击画布，是否加载了一个新页面（这只能是因为调用了提交函数，它不在锚点或任何东西中），但是上述测试失败并执行了else子句。

有什么我做错了或错过了吗？

编辑：我看到我缺少的是单击提交按钮设置我正在检查的变量，但JS提交不会这样做。我确信有一个JS点击方式我可以实现它。我还可以检查设置的实际值。是否有任何实际的理由走一条路？或者也许是另一种更好的选择？

Answer 1

在您的PHP页面上，您检查mapnav，如下所示：

if(isset($_POST['mapnav']))

但是，如果您使用Javascript提交表单，则不会设置按下按钮的值。

可能的解决方案

尝试其他条件来测试坐标是否存在。
尝试将某个值设置为隐藏的表单字段。

Answer 2

mapnav的值只有在您实际点击表单提交 - 按钮时才会发布！

所以你有几个解决方案选择：

Eighter你建立一个新的变量，可能在隐藏的输入中，并在php中为此进行评估。

或者您评估是否收到了xcoord

的值

表单适用于点击，但不适用于JS提交

2 个答案: