pbootcms网站模板|日韩1区2区|织梦模板||网站源码|日韩1区2区|jquery建站特效-html5模板网

簡單html5代碼獲取地理位置_html5教程技巧

簡單html5代碼獲取地理位置_html5教程技巧HTML5中文學習網,是中國最大的HTML5中文門戶,為廣大HTML5愛好者提供各種HTML5資料,包括HTML5網站、HTML5資訊、HTML5應用、HTML5游戲、HTML5教程、HT
點評:這篇文章主要介紹了使用html5代碼來獲取地理位置,具體實現代碼如下并附有截圖,需要的朋友可以參考下
 

復制代碼
代碼如下:

/**
* 以下為html5代碼,獲取地理位置
*/
function getLocation() {
//檢查瀏覽器是否支持地理位置獲取
if (navigator.geolocation) {
//若支持地理位置獲取,成功調用showPosition(),失敗調用showError
// alert("正在努力獲取位置...");
var config = { enableHighAccuracy: true, timeout: 5000, maximumAge: 30000 };
navigator.geolocation.getCurrentPosition(showPosition, showError, config);
} else {
//alert("Geolocation is not supported by this browser.");
alert("定位失敗,用戶已禁用位置獲取權限");
}
}
/**
* 獲取地址位置成功
*/
function showPosition(position) {
//獲得經度緯度
var x = position.coords.latitude;
var y = position.coords.longitude;
//配置Baidu Geocoding API
var url = "http://api.map.baidu.com/geocoder/v2/?ak=C93b5178d7a8ebdb830b9b557abce78b" +
"&callback=renderReverse" +
"&location=" + x + "," + y +
"&output=json" +
"&pois=0";
$.ajax({
type: "GET",
dataType: "jsonp",
url: url,
success: function (json) {
if (json == null || typeof (json) == "undefined") {
return;
}
if (json.status != "0") {
return;
}
setAddress(json.result.addressComponent);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("[x:" + x + ",y:" + y + "]地址位置獲取失敗,請手動選擇地址");
}
});
}
/**
* 獲取地址位置失敗[暫不處理]
*/
function showError(error) {
switch (error.code) {
case error.PERMISSION_DENIED:
alert("定位失敗,用戶拒絕請求地理定位");
//x.innerHTML = "User denied the request for Geolocation.[用戶拒絕請求地理定位]"
break;
case error.POSITION_UNAVAILABLE:
alert("定位失敗,位置信息是不可用");
//x.innerHTML = "Location information is unavailable.[位置信息是不可用]"
break;
case error.TIMEOUT:
alert("定位失敗,請求獲取用戶位置超時");
//x.innerHTML = "The request to get user location timed out.[請求獲取用戶位置超時]"
break;
case error.UNKNOWN_ERROR:
alert("定位失敗,定位系統失效");
//x.innerHTML = "An unknown error occurred.[未知錯誤]"
break;
}
}
/**
* 設置地址
*/
function setAddress(json) {
var position = document.getElementById("txtPosition");
//省
var province = json.province;
//市
var city = json.city;
//區
var district = json.district;
province = province.replace('市', '');
position.value = province + "," + city + "," + district;
position.style.color = 'black';
}

【網站聲明】本站除付費源碼經過測試外,其他素材未做測試,不保證完整性,網站上部分源碼僅限學習交流,請勿用于商業用途。如損害你的權益請聯系客服QQ:2655101040 給予處理,謝謝支持。

相關文檔推薦

主站蜘蛛池模板: hc22_hc22价格_hc22哈氏合金—东锜特殊钢 | 老房子翻新装修,旧房墙面翻新,房屋防水补漏,厨房卫生间改造,室内装潢装修公司 - 一修房屋快修官网 | 钢格板|镀锌钢格板|热镀锌钢格板|格栅板|钢格板|钢格栅板|热浸锌钢格板|平台钢格板|镀锌钢格栅板|热镀锌钢格栅板|平台钢格栅板|不锈钢钢格栅板 - 专业钢格板厂家 | 造价工程师网,考试时间查询,报名入口信息-网站首页 | 对照品_中药对照品_标准品_对照药材_「格利普」高纯中药标准品厂家-成都格利普生物科技有限公司 澳门精准正版免费大全,2025新澳门全年免费,新澳天天开奖免费资料大全最新,新澳2025今晚开奖资料,新澳马今天最快最新图库 | GAST/BRIWATEC/CINCINNATI/KARL-KLEIN/ZIEHL-ABEGG风机|亚喜科技 | 清水-铝合金-建筑模板厂家-木模板价格-铝模板生产「五棵松」品牌 | 大米加工设备|大米加工机械|碾米成套设备|大米加工成套设备-河南成立粮油机械有限公司 | 单机除尘器 骨架-脉冲除尘器设备生产厂家-润天环保设备 | 无菌实验室规划装修设计-一体化实验室承包-北京洁净净化工程建设施工-北京航天科恩实验室装备工程技术有限公司 | 喷码机,激光喷码打码机,鸡蛋打码机,手持打码机,自动喷码机,一物一码防伪溯源-恒欣瑞达有限公司 | 出国劳务公司_正规派遣公司[严海]| 地图标注-手机导航电子地图如何标注-房地产商场地图标记【DiTuBiaoZhu.net】 | 鹤壁创新仪器公司-全自动量热仪,定硫仪,煤炭测硫仪,灰熔点测定仪,快速自动测氢仪,工业分析仪,煤质化验仪器 | 异噻唑啉酮-均三嗪-三丹油-1227-中北杀菌剂厂家| 制氮设备-变压吸附制氮设备-制氧设备-杭州聚贤气体设备制造有限公司 | 短信通106短信接口验证码接口群发平台_国际短信接口验证码接口群发平台-速度网络有限公司 | 数码管_LED贴片灯_LED数码管厂家-无锡市冠卓电子科技有限公司 | bng防爆挠性连接管-定做金属防爆挠性管-依客思防爆科技 | 517瓜水果特产网|一个专注特产好物的网站 | 电动高尔夫球车|电动观光车|电动巡逻车|电动越野车厂家-绿友机械集团股份有限公司 | 连续密炼机_双转子连续密炼机_连续式密炼机-南京永睿机械制造有限公司 | 圆形振动筛_圆筛_旋振筛_三次元振动筛-河南新乡德诚生产厂家 | 东莞螺杆空压机_永磁变频空压机_节能空压机_空压机工厂批发_深圳螺杆空压机_广州螺杆空压机_东莞空压机_空压机批发_东莞空压机工厂批发_东莞市文颖设备科技有限公司 | 中高频感应加热设备|高频淬火设备|超音频感应加热电源|不锈钢管光亮退火机|真空管烤消设备 - 郑州蓝硕工业炉设备有限公司 | 棕刚玉-白刚玉厂家价格_巩义市东翔净水材料厂 | 润滑脂-高温润滑脂-轴承润滑脂-食品级润滑油-索科润滑油脂厂家 | 闭端端子|弹簧螺式接线头|防水接线头|插线式接线头|端子台|电源线扣+护线套|印刷电路板型端子台|金笔电子代理商-上海拓胜电气有限公司 | pH污水传感器电极,溶解氧电极传感器-上海科蓝仪表科技有限公司 | 自动售货机_无人售货机_专业的自动售货机运营商_免费投放售货机-广州富宏主官网 | 烟雾净化器-滤筒除尘器-防爆除尘器-除尘器厂家-东莞执信环保科技有限公司 | 视觉检测设备_自动化检测设备_CCD视觉检测机_外观缺陷检测-瑞智光电 | 河南档案架,档案密集架,手动密集架,河南密集架批发/报价 | 一体化污水处理设备_生活污水处理设备_全自动加药装置厂家-明基环保 | 皮带输送机-大倾角皮带输送机-皮带输送机厂家-河南坤威机械 | 耐磨陶瓷管道_除渣器厂家-淄博浩瀚陶瓷科技有限公司 | 广州企亚 - 数码直喷、白墨印花、源头厂家、透气无手感方案服务商! | 铝板冲孔网,不锈钢冲孔网,圆孔冲孔网板,鳄鱼嘴-鱼眼防滑板,盾构走道板-江拓数控冲孔网厂-河北江拓丝网有限公司 | 低合金板|安阳低合金板|河南低合金板|高强度板|桥梁板_安阳润兴 北京租车牌|京牌指标租赁|小客车指标出租 | 济南展厅设计施工_数字化展厅策划设计施工公司_山东锐尚文化传播有限公司 | 大流量卧式砂磨机_强力分散机_双行星双动力混合机_同心双轴搅拌机-莱州市龙跃化工机械有限公司 |