2 回答
TA贡献1804条经验 获得超2个赞
您必须不了解javascript的异步特性,否则这是一个非常简单的问题。无论如何,我解释
当页面加载并找到window.onload=PageLoad();它时,调用该PageLoad()函数,然后
function PageLoad() {
getLocation(); // <-- gets called
document.frm1.submit(); // <-- doesn't wait for getLocation() to complete;
// rather runs right away
}
如您所料,在getLocation()执行任务时(在“线程” A中)document.frm1.submit();被运行(在另一线程“ B”中),并提交了您不期望的表单。
因此,您需要做的是将提交相关代码移入showPosition()浏览器中,以便一旦浏览器获取位置然后提交表单。
function showPosition(position) {
document.getElementById("getlat").value = position.coords.latitude;
document.getElementById("getlon").value = position.coords.longitude;
lon=document.getElementById("getlon").value;
lat=document.getElementById("getlat").value;
document.frm1.submit(); <-- submits when browser gets the users location
}
TA贡献1803条经验 获得超6个赞
根据mdn文档
getCurrentPosition()方法。这将启动一个异步请求以检测用户的位置
您正在发送表格,然后再获取坐标。解决方案是仅在异步请求结束时才使用更新后的隐藏输入的值发送此表单。请尝试以下示例
有这个HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<form action="results.php" name="frm1">
<input type="hidden" name="longitude" id="getlon" />
<input type="hidden" name="latitude" id="getlat" />
</form>
<script src="geo.js"></script>
</body>
</html>
JS
document.addEventListener('DOMContentLoaded', () => {
pageLoad();
});
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, positionError);
}
}
function showPosition(position) {
console.log(position);
document.getElementById('getlat').value = position.coords.latitude;
document.getElementById('getlon').value = position.coords.longitude;
lon = document.getElementById('getlon').value;
lat = document.getElementById('getlat').value;
document.frm1.submit(); // here the form is submit
}
function positionError(error) {
if (error.PERMISSION_DENIED) alert('Please accept geolocation');
hideLoadingDiv();
showError('Geolocation is not enabled. Please enable to use this feature');
}
function pageLoad() {
getLocation();
}
我在这里使用DOM准备就绪时
添加回答
举报