Question

我有一个表单，用户可以点击谷歌地图上的地址，输入国家，地产，县，地址自动填写，但如果用户想要用文字填写输入，自动地址定位地图。这两个函数都能正常工作，但在用户填写输入文本后，如果点击地图就完成了地理定位，则addlistener不再起作用。

整个代码很长，所以我只是在这里放入最重要的部分

function geolocalizarTM(){
console.log("entre en geolocalizarTM");
var gmap, divmap;
divmap = $('#map');
d1  = document.getElementById('direccion1').value; 
d2 = document.getElementById('direccion2').value; 
num = document.getElementById('numero').value; 
codp = document.getElementById('codigo_postal').value; 
prov = document.getElementById('provincia_id').value;
pob = document.getElementById('poblacion_id').value;
country = document.getElementById('pais_id').value;
if((d1!="")&& (codp!="")&&(prov!="")&&(pob!="")&&(country!="")){
    direccionText = d1 + "," + num + "," + codp + "," + prov + "," + pob + "," + country;                    
    $.ajax({
        type: "GET",
        url: "https://maps.googleapis.com/maps/api/geocode/json?address=" + direccionText + "&key=AIzaSyCy96_rJ419QasmI4RaJs3uHO-PUh-bNuc",
        dataType: "json",
        success: processJSON
    });
function processJSON(json) {
    lat = json.results[0].geometry.location.lat;
    lon = json.results[0].geometry.location.lng;

    latLon = new google.maps.LatLng(lat, lon);
    objConfig = new Object();

    objConfig.zoom = 18;
    objConfig.center = latLon;
    gmap = new google.maps.Map(divmap[0], objConfig);

    var marker = new google.maps.Marker({
        position: latLon,
        map: gmap,
    });
    directionsDisplay.setMap(gmap);
    marker.setMap(gmap);
    }
}
};


var ul = document.getElementById('panelContenedor');
var directionDisplay;
var directionsService;
var lat, lon, latLon, objConfig, ubicacionProd;
ubicacionProd = "";

var gmap, divmap;
divmap = $('#map');
showMap();
function showMap() {
    navigator.geolocation.getCurrentPosition(fn_ok, fn_error);
}
function fn_error() {
    console.log('geolocalizacion, ha ocurrido un error...');
}
function fn_ok(resp) {
    console.log("inicializo el mapa");
    lat = resp.coords.latitude;
    lon = resp.coords.longitude;
    latitud = document.getElementById("latitud").value;
    longitud = document.getElementById("longitud").value;
    if (latitud != "" && longitud != "") {
        lat = latitud;
        lon = longitud;
    }
   latLon = new google.maps.LatLng(lat, lon);
   objConfig = new Object();
   objConfig.zoom = 18;
   objConfig.center = latLon;
   gmap = new google.maps.Map(divmap[0], objConfig);

directionsService = new google.maps.DirectionsService();
directionsDisplay = new google.maps.DirectionsRenderer();
var marker = new google.maps.Marker({
    position: latLon,
});
directionsDisplay.setMap(gmap);

marker.setMap(gmap);

google.maps.event.addListener(gmap, 'click', function (e) {
    fx(e.latLng);
});

function fx(latLng) {
    console.log("pinche el mapa");
    marker.setMap(null);
    $('#localizacion').val(latLng);
    var request = {
        origin: latLng,
        destination: latLng,
        travelMode: google.maps.DirectionsTravelMode.DRIVING
    };
    directionsService.route(request, function (response, status) {
        console.log(response);

    if (status == google.maps.DirectionsStatus.OK) {
        var point = response.routes[0].legs[0];
        marker.setOptions({map: gmap, position: point.start_location});
        gmap.setCenter(point.start_location);
        var direction = response.routes[0].legs[0].start_address.split(",");

    }
        /****aqui debo llenar los campos de la direccion****/
        console.log("Direccion: [0]" + direction[0] + "** [1]" + direction[1] + "** [2]" + direction[2] + "** [3]" + direction[3] + "** [4]" + direction[4] + '\n');
        var num_posiciones = direction.length; // determinamos el numero de campos que trae el arreglo
        /* blanqueo las cajitas*/
        $('#direccion1').val("");
        $('#direccion2').val("");
        $('#pais_id').val("");
        $('#provincia_id').val("");
        $('#numero').val("");
        $('#codigo_postal').val("");
        $('#poblacion_id').val("");
        /*

        ** here I fill the inputs ***

        */
    });
}
}

我希望你能帮助我，非常感谢。

Answer 1

我已经解决了这个问题。我是在proscessJson函数之后我没有调用函数fn_ok（）。这就是google.maps.event.addListener（gmap，'click'，function（e）无效的原因。

所以，我希望这篇文章对某人有用。

在地理定位谷歌地图后，addlistener点击停止工作

1 个答案: