最近修改公司项目,设计到了一个展示用户地址的功能,原先的功能已经失效,所以只好重新做这个功能了。
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>百度地图</title> <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script> </head> <body onload="getAdress()"> <div style=" 750px; height: 430px; border: 1px solid gray" id="container"> </div> <div style="margin: 10px 0;"> <input type="text" style=" 300px; margin-left: 405px; border: 1px solid gray" value="" id="searchValue" /> <input type="button" style="border: 1px solid gray" value="搜索" onclick="search()" /></div> </body> </html> <script type="text/javascript"> var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(121.461165, 31.234095), 11); function search() { //removeMarker(); var address = document.getElementById('searchValue').value; var addresses = address.split(":"); var myAddress = null; if (addresses[1] == null) myAddress = address; else myAddress = addresses[1]; var myGeo = new BMap.Geocoder(); myGeo.getPoint(myAddress, function (point) { //我输入的是“南京路”,第一步getPoint是地址解析。 if (point) { map.centerAndZoom(point, 16); map.addOverlay(new BMap.Marker(point));//添加标注点 myGeo.getLocation(point, function (rs) { //这里弹出“南京路”的详细地址信息,第二步getLocation是反地址解析。 document.getElementById('searchValue').value = '具体位置:' + myAddress; //alert(myAddress+'的具体位置是:'+addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber); }); } }, "上海市"); //必须设置城市 } function removeMarker() { //清楚标注点 var selector = document.getElementById("markers"); var item = selector.options[selector.selectedIndex].value; maplet.removeOverlay(markerArr[item]); selector.removeChild(selector.options[selector.selectedIndex]); if (selector.options.length == 0) { selector.parentNode.removeChild(selector); document.body.removeChild(document.getElementById("delBtn")); document.getElementById("lab").innerHTML = "标注已经全部删除。"; delete markerArr; } } function getAdress() { map.enableScrollWheelZoom(); // 启动鼠标滚轮操作 map.enableKeyboard(); //启动键盘操作 map.enableContinuousZoom(); // 开启连续缩放效果 map.enableInertialDragging(); // 开启惯性拖拽效果 var args = window.location.href.split("?"); if (args == window.location.href) return; var str = args[1]; var adress = str.split("="); document.getElementById('searchValue').value = adress[1]; search(); } </script>