これは私がやったことであり、動作します:
HTML:
<input name="location" id="autocomplete" autocomplete="off" type="text" class="textbx" placeholder="Enter Destination" required>
googleautocompletecustomized.js:
function initialize() {
// Create the autocomplete object, restricting the search
// to geographical location types.
if($('#autocomplete').length){
autocomplete = new google.maps.places.Autocomplete(
(document.getElementById('autocomplete')),
{
types: ['(regions)'],
componentRestrictions: {country: "in"}
});
google.maps.event.addListener(autocomplete, 'place_changed', function() {
$('#autocomplete').closest('form').data('changed', true);
fillInAddress();
});
}
//select first result
$('#autocomplete').keydown(function (e) {
if (e.keyCode == 13 || e.keyCode == 9) {
$(e.target).blur();
if($(".pac-container .pac-item:first span:eq(3)").text() == "")
var firstResult = $(".pac-container .pac-item:first .pac-item-query").text();
else
var firstResult = $(".pac-container .pac-item:first .pac-item-query").text() + ", " + $(".pac-container .pac-item:first span:eq(3)").text();
var geocoder = new google.maps.Geocoder();
geocoder.geocode({"address":firstResult }, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
placeName = results[0];
e.target.value = firstResult;
fillInAddress(placeName);
$('#datetimepicker1 .input-group-addon').click();
}
});
}
});
}
// [START region_fillform]
function fillInAddress(place) {
// Get the place details from the autocomplete object.
if(!place)
var place = autocomplete.getPlace();
for (var component in componentForm) {
document.getElementById(component).value = '';
document.getElementById(component).disabled = false;
}
// Get each component of the address from the place details
// and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
document.getElementById(addressType).value = val;
}
}
}