如何在输入中键入地址时发送新的地理定位请求并刷新Google地图?

时间:2012-03-30 13:56:53

标签: javascript jquery google-maps google-maps-api-3

我想刷新Google地图并发送新的地理定位请求而不刷新页面,同时用户在输入时输入地址(城市和地址,国家/地区不变)。我怎么能这样做?

<input type="text" id="input_adress" />
<script type="text/javascript">
function mapk() {
//code about start the map (new google.maps.Map)...
geokoder.geocode({address: 'UK'}, start_geocode);
}
function start_geocode(var1, status) {    
//more code...    
</script>

现在是我想要开始的代码:

$(function()
   {$('#input_adress').keyup(function() {

       });
   });

我不确定下一步该怎么办?可能我需要先选择地图......

geokoder.geocode({address: 'UK '+$('#input_adress').val()}, start_geocode);

我的页面上有jQuery库。这够了吗?

2 个答案:

答案 0 :(得分:1)

尝试这样的事情:

$('#clickme').click(function() {
    geocoder.geocode({'address': $('#input_address').val()}, function(results, status) {
        setMap(results[0].geometry.location.lat(), results[0].geometry.location.lng());
    })
});

function setMap(lat, lng) {
    map_location = new google.maps.LatLng(lat, lng);
    marker.setPosition(map_location);
    map.setCenter(map_location);
}

这会在按钮上使用click进行搜索,但您可以在输入上使用按键/更改。

Working example here

答案 1 :(得分:1)

对于实时搜索/查询,我所做的是监视用户输入的keydown,当有暂停表示用户完成输入时,我会处理用户输入。

的onkeydown:

clearTimeout(timer); timer = setTimeout(function(){ process(); }, 500);