Question

我希望在加载页面时只调用一次这个JS函数。

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;  
    window.location.href = "?    latitude="+position.coords.latitude+"&longitude="+position.coords.longitude;
    var flag = true;
}

Answer 1

它进入无限循环，因为您正在使用

重定向页面

window.location.href = "?    latitude="+position.coords.latitude+"&longitude="+position.coords.longitude;

每次页面加载时

相反，你可以为showPosition（）执行类似的操作：

function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude;  
    var query = "?    latitude="+position.coords.latitude+"&longitude="+position.coords.longitude;
    var stateObj = { query: query };
    history.pushState(stateObj, "query added", query);
    var flag = true;
}

这会将查询参数添加到URL而不刷新页面。有关history.pushState()的详细信息，请参阅https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history

Answer 2

你的代码是一个很大的关闭！它会在此步骤中生成新请求：

window.location.href = "?latitude="+position.coords.latitude+"&longitude="+position.coords.longitude;

您可以使用不同的方式：

在加载时简单解析window.location.href并且不询问位置if (window.location.href.indexOf('?')!=-1)
使用浏览器数据存储或coockies标记客户端，并在询问位置之前进行检查。

使用Ajax向服务器发送位置信息：

var req = (window.XMLHttpRequest)?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");
req.onreadystatechange=function(){if((req.readyState==4)&&(req.status==200)){ console.log('location was sended to server'); }};
req.open("GET","?latitude="+position.coords.latitude+"&longitude="+position.coords.longitude,true);
req.send(null);

Answer 3

您只需使用onload事件处理程序：

<body onload="getLocation()">

页面准备就绪后会立即触发。

或者，您可以像这样使用jQuery＆＃39; .ready()：

$(document).ready(function(){
    getLocation();
});

仅在加载时加载js功能

3 个答案: