Question

我想找到当前位置的纬度和经度，并在点击按钮时在另一页上打印相同的内容。虽然我成功获得了纬度和经度，但无法在另一页上打印/重定向。

有人可以帮忙吗？请找到以下代码：

<!DOCTYPE html>
<html>
<head>
<script>
<p id="demo"></p>
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 showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude;
}
</script> 
</head>

<body>
<h2 >Geo-Logical Application</h2><br>
<p>Click the button to get Longitude and Latitude for your current position.</p><br>

<form action="Listing.html">
<button type="submit" onclick="getLocation()">Submit</button>
</form>

</body>
</html>

我想将输出重定向到列表页面。感谢

Answer 1

使用window.location重定向到另一个页面＆amp;
将event传递给getLocation以停止默认提交：

修改如下：

function getLocation(event) {
     event.preventDefault();
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(p){
               showPosition(p);
                // 
               window.location="Listing.html?lat="+p.coords.latitude+"&lgt="+p.coords.longitude; 
         });
    } else { 
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}

HTML变为：

<form action="Listing.html">
<button type="submit" onclick="getLocation(event)">Submit</button>
</form>

如果您的页面处理GET参数：

window.location="Listing.html?lat="+p.coords.latitude+"&lgt="+p.coords.longitude;

否则，使用sessionStorage进行有状态应用：

sessionStorage.setItem('POS',JSON.stringify(position.coords))和Listing.html中的JSON.parse(sessionStorage.getItem('POS'))

Answer 2

首先，你不应该在脚本中有一个p元素。它应该在体内。此外，您的脚本标记应位于正文的末尾，因为它具有修改DOM的代码。 showPosition（position）函数应该在getLocation（）函数之前，因为你在getLocation中使用了showPosition。

无法在另一个页面中重定向输出（HTML，Javascript）

2 个答案: