Jquery ajax Post 变量到 php
Jquery ajax Post variables to php
我的ajax.php脚本
<?php
$lat =$_POST['lat'];
$lon = $_POST['lon'];
echo $lat;
echo $lon;
?>
还有我的 new.html 页面
<!DOCTYPE html>
<html><head><script src="jquery-1.12.0.min.js"></script>
</head>
<body>
<p>Click the button to get your coordinates.</p>
<input type="text" name="metin"/><br/>
<button onclick="getLocation()">Try It</button>
<p id="demo"></p>
<p id="demo1"></p>
<script>
var x = document.getElementById("demo");
var y = document.getElementById("demo1");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude + "<br>Longitude: " + position.coords.longitude;
var lon= position.coords.longitude;
var lat= position.coords.longitude;
y.innerHTML=lon;
x.innerHTML=lat;
$.ajax({
type: 'POST',
url: 'ajax.php',
data: { lat:lat, lon:lon}
success: function(result) {
$('#sonuc').html(result);
},
error: function() {
alert('Some error found. Please try again!');
}
});
}
}
</script>
<p id="sonuc"></p>
</body>
</html>
首先我知道有未使用的代码。但是我要用这个积木。
它没有给我任何回应。它必须成功地工作。
但它没有在我的 php 页面中提供纬度和经度变量。
İf 还有另一种方法可以将变量发送到 php 页面,我可以试试。
代码中没有功能问题。但是有一些语法错误阻止了 ajax 请求。
- 避免在函数 showPosition() 下方使用额外的右大括号。
- 在 ajax 请求中的数据部分后添加逗号。
更正后的代码如下。
<script>
var x = document.getElementById("demo");
var y = document.getElementById("demo1");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude + "<br>Longitude: " + position.coords.longitude;
var lon= position.coords.longitude;
var lat= position.coords.longitude;
y.innerHTML=lon;
x.innerHTML=lat;
$.ajax({
type: 'POST',
url: 'ajax.php',
data: { lat:lat, lon:lon},
success: function(result) {
$('#sonuc').html(result);
},
error: function() {
alert('Some error found. Please try again!');
}
});
}
</script>
我的ajax.php脚本
<?php
$lat =$_POST['lat'];
$lon = $_POST['lon'];
echo $lat;
echo $lon;
?>
还有我的 new.html 页面
<!DOCTYPE html>
<html><head><script src="jquery-1.12.0.min.js"></script>
</head>
<body>
<p>Click the button to get your coordinates.</p>
<input type="text" name="metin"/><br/>
<button onclick="getLocation()">Try It</button>
<p id="demo"></p>
<p id="demo1"></p>
<script>
var x = document.getElementById("demo");
var y = document.getElementById("demo1");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude + "<br>Longitude: " + position.coords.longitude;
var lon= position.coords.longitude;
var lat= position.coords.longitude;
y.innerHTML=lon;
x.innerHTML=lat;
$.ajax({
type: 'POST',
url: 'ajax.php',
data: { lat:lat, lon:lon}
success: function(result) {
$('#sonuc').html(result);
},
error: function() {
alert('Some error found. Please try again!');
}
});
}
}
</script>
<p id="sonuc"></p>
</body>
</html>
首先我知道有未使用的代码。但是我要用这个积木。 它没有给我任何回应。它必须成功地工作。 但它没有在我的 php 页面中提供纬度和经度变量。 İf 还有另一种方法可以将变量发送到 php 页面,我可以试试。
代码中没有功能问题。但是有一些语法错误阻止了 ajax 请求。
- 避免在函数 showPosition() 下方使用额外的右大括号。
- 在 ajax 请求中的数据部分后添加逗号。
更正后的代码如下。
<script>
var x = document.getElementById("demo");
var y = document.getElementById("demo1");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude + "<br>Longitude: " + position.coords.longitude;
var lon= position.coords.longitude;
var lat= position.coords.longitude;
y.innerHTML=lon;
x.innerHTML=lat;
$.ajax({
type: 'POST',
url: 'ajax.php',
data: { lat:lat, lon:lon},
success: function(result) {
$('#sonuc').html(result);
},
error: function() {
alert('Some error found. Please try again!');
}
});
}
</script>