Question

我有一个小表单，目前使用按钮从Google Maps API获取经度和纬度，并将结果放入输入字段。触发器是按钮上的事件侦听器。我想摆脱按钮，在城市被添加后触发事件。我不确定这是如何实现的。这是我在JS fidler中的代码。 enter link description here

function showResult(result) {
    document.getElementById('latitude').value = result.geometry.location.lat()   +' '+ result.geometry.location.lng();

}

function getLatitudeLongitude(callback, address) {
     // If adress is not supplied, use default value 'Ferrol, Galicia, Spain'
address = address || 'Ferrol, Galicia, Spain';
    // Initialize the Geocoder
    geocoder = new google.maps.Geocoder();
    if (geocoder) {
        geocoder.geocode({
            'address': address
        }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) { 
                callback(results[0]);
            }
        });
    }
}

var button = document.getElementById('btn');

button.addEventListener("click", function () {
    var address = document.getElementById('street').value  +' '+ document.getElementById('city').value;
    getLatitudeLongitude(showResult, address)
});

Answer 1

在改变城市时举办活动。

var city = document.getElementById('city');

city.addEventListener("change", function () {
    var address = document.getElementById('street').value  +' '+ document.getElementById('city').value;
    getLatitudeLongitude(showResult, address)
});

Answer 2

模糊事件：

var city = document.getElementById('city');
city.addEventListener("blur", function () {
   var address = document.getElementById('street').value  +' '+ document.getElementById('city').value;
   getLatitudeLongitude(showResult, address)
});

更新小提琴：https://jsfiddle.net/z6874xou/10/

Answer 3

检查此代码JS Fiddle。我为城市输入框添加了onchange事件

 var city = document.getElementById('city');

 city.addEventListener("change", function () {
 var address = document.getElementById('street').value  +' '+ 
 document.getElementById('city').value;
 getLatitudeLongitude(showResult, address) 
});

我想在输入输入字段后运行一个函数

3 个答案: