您的代码中有几个奇怪的东西。您的小提琴设置为运行 onLoad，这意味着您在 JavaScript 中定义的函数将无法全局使用 - 它们将在 window.onload 处理程序中定义...在此之外没有代码可以访问它们（尤其是内联事件处理程序）。这是为什么不使用内联事件处理程序的完美示例（即使问题确实是由于 jsFiddle 设置造成的）。
这意味着，当您在按钮的内联 click 处理程序中调用 alert(); 时，它会调用本机 window.alert() 函数，从而打开一个对话框窗口。由于您没有向它传递任何内容，因此它显示undefined。它实际上并没有调用您创建的 alert 函数。
另外，由于getCurrentPosition方法似乎是异步的，你应该给lat传递一个回调函数，这样你就可以在它获得位置时调用它。
试试这个：
function lat(callback) {
navigator.geolocation.getCurrentPosition(function (position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
callback.call(null, lat, lon);
}, function (error) {
console.log("Something went wrong: ", error);
});
}
function getPosition() {
lat(function (latitude, longitude) {
alert("lat: " + latitude + ", lon: " + longitude);
});
}
http://jsfiddle.net/yJrtR/1/
更新：
根据您的评论，如果您希望它“实时”显示，您可以使用以下内容：
window.onload = function () {
var latElement = document.getElementById("lat"),
lonElement = document.getElementById("lon"),
lastUpdatedElement = document.getElementById("last_updated"),
getPositionOptions = {
enableHighAccuracy: false,
timeout: 10000,
maximumAge: 0
},
getPos = function () {
console.log("getPos function called");
navigator.geolocation.getCurrentPosition(function (position) {
console.log("Successfully retrieved position: ", position);
var coords = position.coords;
latElement.innerHTML = coords.latitude;
lonElement.innerHTML = coords.longitude;
lastUpdatedElement.innerHTML = new Date(position.timestamp);
setTimeout(getPos, 5000);
}, function (error) {
console.log("Something went wrong retrieving position: ", error);
setTimeout(getPos, 5000);
}, getPositionOptions);
};
getPos();
};
使用以下 HTML（只是为了“模拟”您所说的对话框）：
<div id="dialog">
<div>Your latitude is: <span id="lat"></span></div>
<div>Your longitude is: <span id="lon"></span></div>
<div>Last Updated: <small id="last_updated"></small></div>
</div>
演示： http://jsfiddle.net/yJrtR/12/
所以这段代码的作用是从window 具有loaded 的时间开始，它不断地重新获取地理位置。您可以将一些特殊选项传递给getCurrentPosition，我在getPositionOptions 中声明了这些选项。
正如我之前所说，getCurrentPosition 是异步的，因此在调用getCurrentPosition 后随时可以检索位置……这就是回调的用途。在选项对象中，我设置了一个超时 - 10000 - 表示“检索位置的时间不会超过 10 秒”，如果是，它将调用错误回调。 maximumAge 选项确保它始终尝试在特定时间段内获取当前位置（而不是使用缓存版本。
所以当任何一个回调被调用时（可能是 1 秒后，也可能是 20 秒后......虽然我们设置了 10 秒的超时），它会用细节更新 HTML，然后再做一遍 5几秒钟后 - 这就是 setTimeout 的用途。这是因为如果我们不断尝试获取位置（没有任何延迟），页面将非常忙于获取位置。 5 秒的延迟，甚至最多 15 秒应该没问题。
参考：
更新：
geolocation 功能有一个特定的方法，可以让您观察位置，称为watchPosition，它完全按照我试图模仿的方式进行，但效率更高。你可以试试这个：
window.onload = function () {
var latElement = document.getElementById("lat"),
lonElement = document.getElementById("lon"),
lastUpdatedElement = document.getElementById("last_updated"),
watchPositionOptions = {
enableHighAccuracy: false,
timeout: 10000,
maximumAge: 0
};
navigator.geolocation.watchPosition(function (position) {
console.log("Successfully retrieved position: ", position);
var coords = position.coords;
latElement.innerHTML = coords.latitude;
lonElement.innerHTML = coords.longitude;
lastUpdatedElement.innerHTML = new Date(position.timestamp);
}, function (error) {
console.log("Something went wrong retrieving position: ", error);
}, watchPositionOptions);
};
演示： http://jsfiddle.net/yJrtR/14/
参考：