php-在mousemove上调用jQuery AJAX

我有一个用gdimage创建的图像,它有40000个5×5块链接到不同的用户配置文件,我希望当您将鼠标悬停在这些块之一上时,AJAX会通过检测x和y co-来从数据库中获取该配置文件.将其移到图像上方时会发出命令.

然后,单击该链接,并获得该信息,并获得指向该用户配置文件的链接.

这是到目前为止我得到的：

Javascript / jQuery：

<script type="text/javascript">

    jQuery.fn.elementlocation = function() {

        var curleft = 0;
        var curtop = 0;

        var obj = this;

        do {

        curleft += obj.attr('offsetLeft');
        curtop += obj.attr('offsetTop');

        obj = obj.offsetParent();

        } while ( obj.attr('tagName') != 'BODY' );


            return ( {x:curleft, y:curtop} );

    };


    $(document).ready( function() {

        $("#gdimage").mousemove( function( eventObj ) {

            var location = $("#gdimage").elementlocation();
            var x = eventObj.pageX - location.x;
            var x_org = eventObj.pageX - location.x;
            var y = eventObj.pageY - location.y;
            var y_org = eventObj.pageY - location.y;

            x = x / 5;
            y = y / 5;

            x = (Math.floor( x ) + 1);
            y = (Math.floor( y ) + 1);

            if (y > 1) {

                block = (y * 200) - 200;
                block = block + x;

            } else {

                block = x;

            }

            $("#block").text( block );
            $("#x_coords").text( x );
            $("#y_coords").text( y );

                $.ajax({
                    type: "GET",
                    url: "fetch.php",
                    data: "x=" + x + "&y=" + y + "",
                    dataType: "json",
                    async: false,
                    success: function(data) {
                        $("#user_name_area").html(data.username);
                    }
                });

        });

    });

</script>

PHP：

<?

    require('connect.php');

    $mouse_x = $_GET['x'];
    $mouse_y = $_GET['y'];

    $grid_search = mysql_query("SELECT * FROM project WHERE project_x_cood = '$mouse_x' AND project_y_cood = '$mouse_y'") or die(mysql_error());

    $user_exists = mysql_num_rows($grid_search);

    if ($user_exists == 1) {

        $row_grid_search = mysql_fetch_array($grid_search);

        $user_id = $row_grid_search['project_user_id'];


        $get_user = mysql_query("SELECT * FROM users WHERE user_id = '$user_id'") or die(mysql_error());

        $row_get_user = mysql_fetch_array($get_user);

        $user_name = $row_get_user['user_name'];
        $user_online = $row_get_user['user_online'];

        $json['username'] = $user_name;
        echo json_encode($json);

    } else {

        $json['username'] = $blank;
        echo json_encode($json);

    }

?>

的HTML

<div class="tip_trigger" style="cursor: pointer;">

    <img src="gd_image.php" width="1000" height="1000" id="gdimage" />

    <div id="hover" class="tip" style="text-align: left;">
        Block No. <span id="block"></span><br />
        X Co-ords: <span id="x_coords"></span><br />
        Y Co-ords: <span id="y_coords"></span><br />
        User: <span id="user_name_area">&nbsp;</span>
    </div>

</div>

现在,mousemove位置的’block’,’x_coords’和’y_coords’变量可以正常工作并显示在span标记中,但是它没有从AJAX函数获取PHP变量,我不明白为什么.

我也不知道该怎么做,所以当单击鼠标时,它将获取从fetch.php中获取的变量,并将用户定向到诸如“ / user / view /？id = VAR_ID_NUMBER”的页面

我是用错误的方式来处理还是做错了？有人可以帮忙吗？

标签：ajax,mousemove,html,php,jquery
来源： https://codeday.me/bug/20191208/2093878.html