获取地理位置

可根据获取到的经纬度查询到所在的地理位置。

    <p><button onclick="geoFindMe()">Show my location</button></p>
    <div id="out"></div>
    <script>
        function geoFindMe() {
            
            var output = document.getElementById("out");

            output.innerHTML = "<p>Locating…</p>";
            
            if ("geolocation" in navigator) {
                /* 地理位置服务可用 */
                navigator.geolocation.getCurrentPosition(success, error);
            } else {
                /* 地理位置服务不可用 */
                output.innerHTML = "<p>地理位置服务不可用</p>";
            }

            // 成功调用
            function success(position) {
                var latitude = position.coords.latitude;
                var longitude = position.coords.longitude;
                output.innerHTML = "经度:" + longitude + "<br/>纬度:" + latitude;
            }

            // 失败调用
            function error() {
                output.innerHTML = "无法获取您的位置";
            }

        }
    </script>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏web编程技术分享

【Java框架型项目从入门到装逼】第八节 - 用EasyUI绘制主界面

41480
来自专栏伦少的博客

通过Vue CLI 快速创建Vue项目并部署到tomcat

最近一直在写前端,用的是JSP,但是很多人都说JSP已经过时了。既然做了几个月的前端,那就把前端学的好一点,学点新技术,跟上潮流。感觉Vue挺火的,所以这几天学...

64520
来自专栏上善若水

013 mysql 忘记密码,修改密码

启动:sudo service mysql start 停止:sudo service mysql stop

11650
来自专栏ccylovehs

JavaScript实现iphone时钟

http://www.w3school.com.cn/tags/html_ref_canvas.asp

20730
来自专栏iOS开发攻城狮的集散地

Xcode炫酷插件

19630
来自专栏KaliArch

搭建高可用MongoDB集群(分片)

MongoDB基础请参考:http://blog.51cto.com/kaliarch/2044423

487120
来自专栏python学习之旅

Python+Selenium笔记(九):操作警告和弹出框

#之前发的 driver.switch_to_alert() 这句虽然可以运行通过,但是会弹出警告信息(这种写法3.x不建议使用)  改成 driver.swi...

77690
来自专栏ArrayZoneYour的专栏

借助Babel 7和Webpack构建React Toolchain

React不是完全开箱即用的。它使用了一些最近node才支持的关键字和语法(在本教程中我使用了v 9.3.0版本)。因此需要一些很麻烦的设置,但是Faceboo...

27040
来自专栏娱乐心理测试

小程序之保存图片到相册的几种方法

45040
来自专栏腾讯高校合作

【收藏】2015顶级AI学术会议地图

2015年顶级AI学术会议安排早知道,点击右上角菜单按钮,选择“收藏”,或者直接保存下方图片即可随时查看啦:) ?

39150

扫码关注云+社区

领取腾讯云代金券