Это более элегантный способ ответа Noizy.
Поместите создание автозаполнения и создание слушателя в отдельную функцию, чтобы вы могли использовать его повторно.
I 'Мы добавили в этот код некоторые записи, чтобы вы могли увидеть результат в консоли.
Код
<body onload="initialize()">
<div id="search-area">
<label for="search-field-from">From</label><input type="textbox" id="search-field-from" />
<label for="search-field-to">To</label><input type="textbox" id="search-field-to" />
</div>
<div id="map-canvas"></div>
<script type="text/javascript">
var map;
var place_from;
var place_to;
function initialize() {
initializeMap();
initializeAutocomplete('from');
initializeAutocomplete('to');
}
function initializeMap() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(50.85, 4.35);
var myOptions = {
zoom: 5,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map-canvas'), myOptions);
}
function initializeAutocomplete(type) {
var input = document.getElementById('search-field-' + type);
input.value = ''; //clear autocomplete input field
var countrySelector = document.getElementById('country-selector');
var options = {
types: ['(cities)']
};
var autocomplete = new google.maps.places.Autocomplete(input, options);
addAutompleteListener(autocomplete, type);
}
function addAutompleteListener(autocomplete, type) {
google.maps.event.addListener(autocomplete, 'place_changed', function () {
var place = autocomplete.getPlace();
if ((typeof place.geometry != "undefined")) {
if (place.geometry.viewport) {
map.fitBounds(place.geometry.viewport);
} else {
map.setCenter(place.geometry.location);
map.setZoom(17);
}
eval('place_' + type + ' = place');
console.log('You just filled in the "' + type + '" location');
console.log(eval('place_' + type));
//console.log(place_to);
}
});
}
</script>
</body>
CSS
body {padding:10px;font-family:Arial;font-size:14px;}
#map-canvas{width:100%; height:90%;}
#search-area{padding:20px;margin-bottom:20px;background:#ddd;text-align:center;}
input{font-size:20px;padding:5px;border:0;width:500px;}
label{font-size:20px; padding:10px;}