通过Ajax发送Lat和Long详细信息

时间:2015-06-02 17:17:49

标签: javascript ajax

我正在尝试编写一些代码,按下按钮后,它会通过ajax将lat和long坐标发送到test.php文件。我遇到的问题是它似乎没有调用test.php文件。

<button onClick="getLocation()">Join Me</button>
                   <p id="demo"></p>
  <script>
    var x = document.getElementById("demo");

      function getLocation() {
         if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(showPosition);
      } else { 
          x.innerHTML = "Geolocation is not supported by this browser.";
          }
      }

    function redirectToPosition(position) {

     // ...
      $.ajax({
        type: "POST",
        url: "http://www.domain.co.uk/test.php",
        data:   "lat="+position.coords.latitude+"&long="+position.coords.longitude,

      });
   }

以下是test.php文件的内容,

$lat=(isset($_POST['lat']))?$_POST['lat']:'';
$long=(isset($_POST['long']))?$_POST['long']:'';

$to      = 'lee@recruit-technology.co.uk';
$subject = 'the subject';
$message = "$lat; $long;";
$headers = 'From: webmaster@example.com' . "\r\n" .
'Reply-To: webmaster@example.com' . "\r\n" .
'X-Mailer: PHP/' . phpversion();

mail($to, $subject, $message, $headers);

1 个答案:

答案 0 :(得分:0)

下面。我为你设置了一个小提琴。看起来您可能引用了错误的方法名称(getCurrentPosition vs redirectToPosition)。如果不是这样,看起来你实际上从未调用redirectToPosition(),这就是代码块永远不会执行的原因。

尝试编辑该小提琴,但更改实际的域URI。

    var x = document.getElementById("demo");

  function getLocation() {
     if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(showPosition);
  } else { 
      x.innerHTML = "Geolocation is not supported by this browser.";
      }
  }

function getCurrentPosition(position) {

 // ...
  $.ajax({
    type: "POST",
    url: "http://www.domain.co.uk/test.php", // -> Actual domain here.
    data:   "lat="+position.coords.latitude+"&long="+position.coords.longitude

  });
}

http://jsfiddle.net/tcysvkfz/

无论如何,在你的例子中永远不会调用执行你的AJAX请求的方法,这就是为什么test.php永远不会被命中。