如何讓JS鼠標座標到一個PHP插入查詢？

我試圖創建一個用戶界面，可自動將數據插入到數據庫中。該數據還應該包括鼠標座標，因爲我想在那個地方的世界地圖，以創建一個PIN。如何讓JS鼠標座標到一個PHP插入查詢？

的問題是我不知道如何讓鼠標座標轉換成PHP插入查詢。可以幫我嗎？

PHP

<body> 
    <h1>Add Project to the database</h1>   
    <div class="left_column"> 
     <svg version="1.1" xmlns="//www.w3.org/2000/svg" viewBox="0 0 400 620" xmlns:xlink="//www.w3.org/1999/xlink">    
      //country paths ... 
     </svg> 
    </div> 
    <?php  
    if(isset($_POST['submit'])) 
    { 
     $username = "root"; 
     $password = "clacs_2013"; 
     $hostname = "localhost"; 

     $conn = mysql_connect($hostname, $username, $password) 
      or die("Unable to connect to MySQL"); 
     print_r("INSERT INTO projects VALUES ('".$_POST['project_ID']."', '".$_POST['project_name']."', '".$_POST['project_desc']."', '".$_POST['leftCoord']."', '".$_POST['topCoord']."')"); 
     $insertProject= mysql_query("INSERT INTO projects VALUES ('".$_POST['project_ID']."', '".$_POST['project_name']."', '".$_POST['project_desc']."', '".$_POST['leftCoord']."', '".$_POST['topCoord']."');") 
          or die(mysql_error()); 

     mysql_select_db("clacs") or die(mysql_error()); 

     $retval = mysql_query($insertProject, $conn); 
     if(! $retval) 
     { 
      die('Could not enter data: ' . mysql_error()); 
     } 
     echo "Entered data successfully\n"; 
     mysql_close($conn); 
     } 
     else 
     { 
    ?> 
    <form method="post" action="<?php $_PHP_SELF ?>"> 
     project ID: <input type="text" name="project_ID"><br/> 
     project name: <input type="text" name="project_name"><br/> 
     project description: <input type="text" name="project_desc"><br/> 
     <input type="submit" name="submit" value="Submit"> 
    </form> 
    <?php 
     } 
    ?> 
</body>

$(document).ready(function(){ 
$(".country").click(function(e) { 
    $("form").css("display", "block"); 

    var offset_t = $(this).offset().top - $(window).scrollTop(); 
    var offset_l = $(this).offset().left - $(window).scrollLeft(); 

    var leftCoord = Math.round((e.clientX - offset_l)); 
    var topCoord = Math.round((e.clientY - offset_t)); 

});   
});

來源

2013-10-29 user2933557

當然喲你可以使用Javascript來做到這一點;但如果你無論如何提交表單，你可以考慮使用''（它提交鼠標點擊的座標）。 – eggyal

由於PHP是一個服務器端語言，你不能直接訪問客戶端上運行這些屬性。

但是，您可以創建兩個隱藏的輸入到您的形式，將按住鼠標座標（x和y），並作出JavaScript代碼，會讓看錶的鼠標移動，並定期更新這個領域。

$(document).mousemove(function(e) { 
    $('#input_x').val(e.pageX) 
    $('#input_y').val(e.pageY) 
});

小提琴：http://jsfiddle.net/av4wM/2/

來源

2013-10-29 19:15:02

謝謝sooo。我試圖找出已經好幾個小時了！ – user2933557

在闡述@Guilherme澤恩的與您的代碼的解決方案：

<form method="post" action="<?php $_PHP_SELF ?>"> 
    project ID: <input type="text" name="project_ID"><br/> 
    project name: <input type="text" name="project_name"><br/> 
    project description: <input type="text" name="project_desc"><br/> 
    <input type="hidden" id="topCoord" name="topCoord"> 
    <input type="hidden" id="leftCoord" name="leftCoord"> 
    <input type="submit" name="submit" value="Submit"> 
</form>

$(document).ready(function(){ 
$(".country").click(function(e) { 
    $("form").css("display", "block"); 

    var offset_t = $(this).offset().top - $(window).scrollTop(); 
    var offset_l = $(this).offset().left - $(window).scrollLeft(); 

    var leftCoord = Math.round((e.clientX - offset_l)); 
    var topCoord = Math.round((e.clientY - offset_t)); 

    $('#topCoord').val(topCoord); 
    $('#leftCoord').val(leftCoord); 
});   
});

顯然，這可以簡化

來源

2013-10-29 20:33:39 Matt

如何讓JS鼠標座標到一個PHP插入查詢？

回答

相關問題