网页定位地址获取及信息输入框代码示例
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>网页定位地址获取及信息输入框</title>
<script src='http://api.map.baidu.com/api?v=2.0&ak=fUmCszw7O7G8rBv2MO4MLLNIA5DNWLoj'></script>
</head>
<body>
<div>
<label>地址:</label>
<span id='location'></span>
</div>
<div>
<label>名字:</label>
<input type='text' id='name'>
</div>
<div>
<label>年龄:</label>
<input type='text' id='age'>
</div>
<script>
// 获取定位地址
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
if(this.getStatus() == BMAP_STATUS_SUCCESS){
// 获取经纬度
var lng = r.point.lng;
var lat = r.point.lat;
// 根据经纬度获取地址
var geoc = new BMap.Geocoder();
geoc.getLocation(r.point, function(rs){
var addComp = rs.addressComponents;
document.getElementById('location').innerHTML = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
});
}
else {
alert('定位失败,请手动输入地址!');
}
},{enableHighAccuracy: true})
<pre><code> // 获取输入的名字和年龄
var nameInput = document.getElementById('name');
var ageInput = document.getElementById('age');
var name = nameInput.value;
var age = ageInput.value;
</script>
</code></pre>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/oYyI 著作权归作者所有。请勿转载和采集!