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

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

问题描述:

我有一个小表单,当前使用按钮从Google Maps API获取经度和纬度,并将结果放入输入字段。触发器是按钮上的事件侦听器。我想摆脱按钮,并在城市添加后触发事件。我不确定这是如何完成的。 这是我在JS小号手中的代码。 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) 
}); 
+0

尝试google maps autocomplete places api。 – RemyaJ

发生变化的城市事件。

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

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

事件上模糊:

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/

检查这个代码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) 
});