onClick返回功能和GeoLocation

Question

我正在创建一个网页，用于将文件上传到服务器。在上传文件之前，我的网页会收集用户的地理位置。但是函数"return GetLocation(("不起作用。我的代码绕过了用于获取GeoLocation的javaScript代码。这是我的代码：

JavaScript：

var x = document.getElementById("LocationStatus");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else { 
x.innerHTML = "Browser not supported!";
return false;
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude + 
"<br>Longitude: " + position.coords.longitude;
document.cookie="lat="+position.coords.latitude+"lon="+position.coords.longitude;
return true;
}
function error(msg) {
var s = document.querySelector('#status');
msg = msg.message ? msg.message : msg; 
s.innerHTML = typeof msg == 'string' ? msg : "failed";
s.className = 'fail';
return false;
}
</script>

HTML:

<form name="form" method="post" action="upload.php" enctype="multipart/form-data" >
<input type="file" name="my_file" />
<button type="submit" onclick="return getLocation()">Upload File</button>
</form>

Answer 1

您永远不会通过在语句中提及return来调用函数。

将代码更改为

<button type="submit" onclick="callFunction();">Upload File</button>

现在将调用getLocation()函数。

在你的代码中，你只是在调用主函数，但其中的函数并没有被调用，所以

试着把他们也叫

<script>
function callFunction(){
getLocation();
showPosition(position);
error(msg);
}
var x = document.getElementById("LocationStatus");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else { 
x.innerHTML = "Browser not supported!";
}
return false;
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude + 
"<br>Longitude: " + position.coords.longitude;
document.cookie="lat="+position.coords.latitude+"lon="+position.coords.longitude;
return false;
}
function error(msg) {
var s = document.querySelector('#status');
msg = msg.message ? msg.message : msg; 
s.innerHTML = typeof msg == 'string' ? msg : "failed";
s.className = 'fail';
return true;
}
</script>

Answer 2

使用onsubmit="getLocation(("而不是onclick，并在表单元素上使用它

<form  method="POST" onsubmit="getLocation()" action="upload.php" 
enctype="multipart/form-data" >
<input type="file" name="my_file" />
<button type="submit">Upload File</button>
</form>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else { 
x.innerHTML = "Browser not supported!";
return false;
}
}