H5地理位置定位，实现点击某一个点，跳转进另外一个页面

最新推荐文章于 2024-08-08 23:45:45 发布

月上谷

最新推荐文章于 2024-08-08 23:45:45 发布

阅读量3.4k

点赞数

CC 4.0 BY-SA版权

分类专栏：前端开发工程师文章标签： H5地理位置定位跳转页面 ajax前后端交互 .net配合百度地图实现

本文链接：https://blog.youkuaiyun.com/weixin_37839390/article/details/79780682

本文介绍如何利用HTML5的地理位置API获取用户位置，并结合jQuery和ajax实现点击地图上的点，前后端交互，通过.NET后台处理，最终跳转至相应页面。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用到的技术点：

前端：HTML5+CSS3+js+jQery+layer.js
后端：.net

js部分代码

//H5实现地理位置定位
function getLocation(){
   
   
    var options={
        enableHighAccuracy:true,
        maximumAge:1000
    }
    if(navigator.geolocation){
        //浏览器支持geolocation
        navigator.geolocation.watchPosition(onSuccess,onError,options);
    }else{
        //浏览器不支持geolocation
        layer.msg('您的浏览器不支持地理位置定位！', {icon: 5});
    }
}
// 自动定位填充当前地址
function onSuccess(position){
   
   
       var longitude =position.coords.longitude;
       var latitude = position.coords.latitude;
       var map = new BMap.Map("allmap");
       var ctrlNav = new window.BMap.Nav