解释为表单中的动画图像元素提交的图像坐标

我想通过检查 php $_POST 数组来捕获指示用户单击动画图像的位置的 X:Y 值。问题是，虽然我可以获取静态图像上的输入提交信息，但我似乎无法从动画图像中获取任何值。

以下是演示此行为的完整 HTML 页面和表单：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Gunfighter Testing Page</title>
<style>
div {
   width:24px;
   height:24px;
   position:relative;
   -webkit-animation:glide 1s ease-in-out alternate infinite;
}

@-webkit-keyframes glide  {
   from {
      left:-400px;
      top:0px;
   }
   
   to {
      left:400px;
      top:0px;
   }
}
</style>
</head>
<body>
<center>
<form method="post">
<input type="image" name="Staredown" value="Staredown" alt="Staredown" src="https://i.imgur.com/sQwX4Qg.png">
<input type="image" name="Gesture"  value="Gesture"  alt="Gesture" src="https://i.imgur.com/0iJnH5Q.png"><br>
<div><input type="image" name="Shoot"  value="Shoot"  alt="Shoot" src="https://i.imgur.com/i9oV2j3.png"></div>
</form>
</center>
</body>

这里有一些 php 检查表单（按钮）提交并显示单击的图像内的坐标：

<?php
//var_dump($_POST);
echo "Form (button click) results (a pefect score is x=32 and y=32: <br>\n";
echo "<p>\n";
if ((isset($_POST["Staredown_x"])) || (isset($_POST["Gesture_x"])) || (isset($_POST["Shoot_x_x"]))){
    switch (true){
        case (isset($_POST["Staredown_x"])):
            echo "Staredown click coords=> X:" . $_POST["Staredown_x"] . "; Y:" . $_POST["Staredown_y"] . ".<br>\n";
            break;
        case (isset($_POST["Gesture_x"])):
            echo "Gesture click coords=> X:" . $_POST["Gesture_x"] . "; Y:" . $_POST["Gesture_y"] . ".<br>\n";
            break;
        case (isset($_POST["Shoot_x"])):
            echo "Shoot click coords=> X:" . $_POST["Shoot_x"] . "; Y:" . $_POST["Shoot_y"] . ".<br>\n";
            break;
    }
} else {
echo "Score will be displayed upon clicking on a button.<br>\n";
}
?>

为什么我可以获取点击图像中的点击坐标（如果它们是静态的），但无法让动画图像以相同的方式表现？动画图像不会用点击的坐标填充 $_POST["Shoot_x"] （或以我似乎可以在 php 中收集的任何其他方式注册）。

P粉421119778320 天前685

解释为表单中的动画图像元素提交的图像坐标

全部回复(1)我来回复