Javascript 谷歌地图搜索框的结果,点击回车键或点击按钮
我正在做一个例子,在这个例子中,我准备了一个GooglePlace搜索框,它可以让我通过自动完成工具直接输出地图Javascript 谷歌地图搜索框的结果,点击回车键或点击按钮,javascript,jquery,google-maps,Javascript,Jquery,Google Maps,我正在做一个例子,在这个例子中,我准备了一个GooglePlace搜索框,它可以让我通过自动完成工具直接输出地图 若我在搜索框中写些东西,然后按键盘上的回车键,那个么搜索框应该可以工作 2.我想要搜索框旁边的按钮,如果我在搜索框中输入了值,单击该按钮后会给出结果。 例如: $(函数(){ var lat=44.88623409320778, 液化天然气=-87.86480712897173, latlng=新的google.maps.latlng(lat,lng); //动物控制:对, //Z
$(函数(){
var lat=44.88623409320778,
液化天然气=-87.86480712897173,
latlng=新的google.maps.latlng(lat,lng);
//动物控制:对,
//ZoomControl选项:google.maps.ZoomControl样式.LARGE,
变量映射选项={
中心:新google.maps.LatLng(lat,lng),
缩放:13,
mapTypeId:google.maps.mapTypeId.ROADMAP,
泛控制:对,
全控选项:{
位置:google.maps.ControlPosition.TOP\u右
},
动物控制:对,
ZoomControl选项:{
样式:google.maps.ZoomControlStyle.LARGE,
位置:google.maps.ControlPosition.TOP_左
}
},
map=new google.maps.map(document.getElementById('map_canvas')、mapOptions),
marker=新的google.maps.marker({
真的,
位置:latlng,
地图:地图,
});
var input=document.getElementById('searchTextField');
var autocomplete=new google.maps.places.autocomplete(输入{
类型:[“地理编码”]
});
autocomplete.bindTo('bounds',map);
var infowindow=new google.maps.infowindow();
google.maps.event.addListener(自动完成,'place\u changed',函数(事件){
infowindow.close();
var place=autocomplete.getPlace();
if(place.geometry.viewport){
map.fitBounds(place.geometry.viewport);
}否则{
地图。设置中心(地点。几何。位置);
map.setZoom(17);
}
moveMarker(place.name、place.geometry.location);
$('.MapLat').val(place.geometry.location.lat());
$('.MapLon').val(place.geometry.location.lng());
});
google.maps.event.addListener(标记'dragend',函数(事件){
$('.MapLat').val(event.latLng.lat());
$('.MapLon').val(event.latLng.lng());
document.getElementById(“lat”).value=event.latLng.lat();
document.getElementById(“long”).value=event.latLng.lng();
infowindow.close();
var geocoder=new google.maps.geocoder();
地理编码({
“latLng”:event.latLng
},功能(结果、状态){
控制台日志(结果、状态);
if(status==google.maps.GeocoderStatus.OK){
控制台日志(结果);
var lat=results[0]。geometry.location.lat(),
lng=结果[0]。几何体。位置。lng(),
placeName=results[0]。地址\u组件[0]。长\u名称,
latlng=新的google.maps.latlng(lat,lng);
移动标记(地名、latlng);
$(“#searchTextField”).val(结果[0]。格式化的_地址);
}
});
});
功能移动标记(地名、latlng){
标记器设置位置(板条);
infowindow.setContent(placeName);
//信息窗口。打开(地图、标记);
}
});代码>
地址:
纬度:
经度:
1.如果我在搜索框中写了一些东西,然后按键盘上的enter键,搜索框应该可以工作
你可以使用google.maps。可以在地图上放置标记或定位地图。看这个
2.我想要搜索框旁边的按钮,如果我在搜索框中输入了值,单击该按钮后会给出结果。
您需要为该事件添加一个。当通过调用addListener()
在对象上注册事件处理程序来接收这些事件时,将执行代码。例如:
function initialize() {
map = new google.maps.Map(document.getElementById('map'), options);
searchBox = new google.maps.places.SearchBox(document.getElementById('searchbox'));
google.maps.event.addListener(searchBox, 'places_changed', processPlacesSearch);
}
var button = document.getElementById('searchbutton');
var searchbox = document.getElementById('searchbox');
button.onclick = function () {
var location = searchbox.value;
processButtonSearch(location);
}
希望这有帮助
function initialize() {
map = new google.maps.Map(document.getElementById('map'), options);
searchBox = new google.maps.places.SearchBox(document.getElementById('searchbox'));
google.maps.event.addListener(searchBox, 'places_changed', processPlacesSearch);
}
var button = document.getElementById('searchbutton');
var searchbox = document.getElementById('searchbox');
button.onclick = function () {
var location = searchbox.value;
processButtonSearch(location);
}