0

我正在输入地址并使用Geocomplete向用户显示可能的地址列表。用户输入完地址后,我想获取输入地址的经度和纬度坐标。我在从列表中获取所选地址的坐标时遇到了一些问题。

我试过 jquery blurafterchange它会在列表弹出时立即触发。我正在寻找一种从列表中设置选定地址的方法loopUpAdd,一旦选择了地址或自动完成完成,我希望能够获取该地址的经度和纬度坐标。中的警报$('#loopUpAdd').blur(function(evt){....显示用户迄今为止输入的值,而不是选择的值。这是我的小提琴GeoCode

HTML

<label>Address</label>
<input type="text" id="loopUpAdd" />
<label>Long</label>
<input type="text" id="long" />
<label>Lat</label>
<input type="text" id="lat" />

jQuery

function getLocation() {

    var input = document.getElementById('loopUpAdd');

    var options = {
        types: ['(cities)'],
            componentRestrictions: {country: 'tt'}
        };

        var autocomplete = new google.maps.places.Autocomplete(input, options); 
        $('#lat').val(0);
        $('#long').val(0);
    }

function codeAddress(address) {
    //var address = document.getElementById("loopUpAdd").value;
    var geocoder = new google.maps.Geocoder();

    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {           
            var lng = results[0].geometry.location.lng();
            var lat = results[0].geometry.location.lat();

            $('#lat').val(lat);
            $('#long').val(lng);
            alert(lng +'-'+lat);
        } else {
            $('#lat').val(0);
            $('#long').val(0);
        }
    });
}

$(document).ready(function () {

    $('#loopUpAdd').blur(function(evt){ 
        alert($(this).val());
        codeAddress($(this).val());          
    });

    $('#loopUpAdd').mouseenter(function(evt){  
        $('#lat').val(0);
        $('#long').val(0);     
    });

    google.maps.event.addDomListener(window, 'load', getLocation);
}); 
4

0 回答 0