Javascript X/Y坐标进入数据库？答案

【问题标题】：Javascript X/Y Coordinates into database?Javascript X/Y坐标进入数据库？
【发布时间】：2011-10-15 16:43:24
【问题描述】：

我已经以不好的方式一遍又一遍地问这个问题，所以我试着让它更清楚。

我有一个 HTML 页面，页面上有一个攻击和重启链接，你获胜后会出现重启链接。

这些链接是 JavaScript：

<script type="text/javascript">
<!--

function attack() { 
window.location = "attack.php?attack=1";
}


function restart() {
window.location = "battle.php?id=1&status=start";
}

-->
</script>

我想做到这一点，一旦人们点击了这些链接之一，（使用 javascript）它会获取点击链接的 X/Y 坐标，并将其插入到数据库中，并具有以下值：

id
ip
username
x
y
restart

对于id、ip、用户名和重启，我可以很容易地使用MYSQL和PHP，但我不知道如何将Javascript信息插入数据库，这将是X/Y坐标。

【问题讨论】：

PHPMyAdmin 是用于管理数据库的 Web 应用程序。它不是您向其发送数据的东西。

标签： php javascript jquery mysql

【解决方案1】：

使用 Insterstellar_coder 的 X/Y javascript sn-p，您可以使用 javascript 对 php 脚本进行 ajax 调用。 ajax 调用将包含所有参数作为参数，服务器上的 php 脚本可以获取这些参数并进行数据库插入。

版本（20111016211256-0400）：添加文件以显示解决方案（据我正确理解该问题）：

我只处理了攻击部分。重启部分类似。

不需要 AJAX 部分，因为我已经捎带了您的攻击并重新启动了 php 文件。

index.html:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>index</title>
    <script type="text/javascript" charset="utf-8">

        // get continous mouse move events and keep the coordinates in tempX and tempY
        // stolen from http://javascript.internet.com/page-details/mouse-coordinates.html
        var IE = document.all?true:false;
        if (!IE) document.captureEvents(Event.MOUSEMOVE)
        document.onmousemove = getMouseXY;
        var tempX = 0;
        var tempY = 0;
        function getMouseXY(e) {
            if (IE) { // grab the x-y pos.s if browser is IE
                tempX = event.clientX + document.body.scrollLeft;
                tempY = event.clientY + document.body.scrollTop;
            }
            else {  // grab the x-y pos.s if browser is NS
                tempX = e.pageX;
                tempY = e.pageY;
            }  
            if (tempX < 0){tempX = 0;}
            if (tempY < 0){tempY = 0;}  
            return true;
        }



        var ip = "10.0.0.1";
        var username = "me";
        var id = "1";

        function Coordinates(x,y) {
            this.x = x;
            this.y = y;
        }

        function attack(e) { 
            window.location = "attack.php?attack=1&x="+tempX+"&y="+tempY+"&ip="+ip+"&username="+username+"&id="+id;
        }


        function restart() {
            window.location = "battle.php?id=1&status=start";
        }
    </script>
</head>
<body id="index" onload="">
    <input type="button" name="attack" value="attack" id="attack" onClick="attack();">
    <input type="button" name="restart" value="restart" id="restart" onClick="restart();">

</body>

</html>

attack.php

<?php

$METHOD = '_' . $_SERVER['REQUEST_METHOD'];
foreach ($$METHOD as $key => $value) {
    $$key = $value;
}

$log = array("attack" => $attack, "x" => $x, "y" => $y, "ip" => $ip, "username" => $username, "id" => $id);
//print_r($log);

try {
    // assuming you use mongodb locally
    $m = new Mongo(); 
    $db = $m->mydb;
    $logs = $db->logs;
    $logs->insert($log, true);
} catch (Exception $e) {
    echo $e; 
} 

?>

【讨论】：

我该怎么做呢？ ://
看看w3schools.com/php/php_ajax_database.asp 这是用于阅读但写作使用相同的策略。
我仍然不知道如何将JS信息插入数据库。 ;-;
我明天回家后会给你更详细的信息。同时，您能告诉我您使用的是哪个数据库吗？

【解决方案2】：

您可以从事件对象中获取 pageX 和 pageY 坐标。这是一些粗略的代码。

$('yourlinkid').click(function(e){      
     var x = e.pageX; // x coordinate
     var y = e.pageY; // y coordinate
});

【讨论】：

所以它会是： $('attack').click(function(e){ var x = e.pageX; // x 坐标 var y = e.pageY; // y 坐标 } );但是然后呢？ o_O 如何插入所有信息？ ://
@sirwuffles：看看this question 和these。以前有人问过这个，你只需要搜索它。而且我很确定您还会使用 Google 找到很多信息。
window.location = "attack.php?attack=1&x="+x+"&y="+y;
这就是它应该的样子吗？ function attackONE() { $('attackONE').click(function(e){ var x = e.pageX; // x coordinate var y = e.pageY; // y coordinate }); window.location = "battle.php?attack=1&x="+x+"&y="+y";"; }

【解决方案3】：

有一个名为Touché 的史诗库。它为您提供了大量有关用户与页面交互的信息（例如单击、拖动）。如果您想将数据发送到数据库或做其他事情，您还可以为 AJAX 目的指定回调。

这是demo

【讨论】：