HTML5 获取当前位置的经纬度

今天上午市场部门让我写一个地图导航的功能，我特么的不想写。一再的推辞。我说你们项目要求紧握需要时间看看，肯定不成的。因为我感觉这个功能首先需要H5 定位，其次就是百度的API。这是我最头疼的东西了。虽然我之前写过百度地图但那效果超级low啊。特么的下午两点人家说了我给你两天时间看看成不成，当时我就郁闷了。。。。。。我说恩。。。啊 好吧。那就看看呗。（PS： 主要自己心里没谱，没写过啊，但是人家给时间了尼还要怎么推脱呢？低头看吧！）但是我看了一下文档，写了一个小demo后瞬间感觉信心倍增啊。原来H5定位没有想象中的那么难啊！

今天给大家看看我自己写的demo怎么实现H5地理定位吧。（就是一个简单的案例长的不漂亮）

页面代码

<p id="demo">点击这个按钮，获得您的坐标：</p>
<button onclick="getLocation()">试一下</button>

JS部分

<script>
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>

例子解释：检测是否支持地理定位

如果支持，则运行 getCurrentPosition() 方法。如果不支持，则向用户显示一段消息。

如果getCurrentPosition()运行成功，则向参数showPosition中规定的函数返回一个coordinates对象

showPosition() 函数获得并显示经度和纬度

上面的例子是一个非常基础的地理定位脚本，不含错误处理。有什么不明白的请看 HTML5API下班了写到这里，晚上继续和大家说说如何利用H5定位功能结合百度API 完成一个导航的需求！有需要的童鞋请继续关注。很多小伙伴找我要demo，今天正好有时间我就稍微的整理了一下。（ps：我一直是很懒的。）需要的自己下载吧！ 移动端的需要部署到自己的服务器上看的哦！
demo下载请点击