谷歌地图搜索功能如何在我的自定义按钮点击javascript（无自动完成）触发

-1

谷歌地图搜索功能如何触发我的自定义按钮点击（不带自动完成）搜索？我已经有这个代码...。谷歌地图搜索功能如何在我的自定义按钮点击javascript（无自动完成）触发

This example使用Google Place自动填充功能将搜索框添加到地图。

人们可以输入地理搜索。

搜索框将返回一个选择列表，其中包含地点和预测搜索条件的混合。

来源

2017-02-25 usman tahir

的问题是有点难以辨认。你能格式化语言的可读性吗？ – Sid

这是我的样品，我使用文本框的“更改”事件和“点击”按钮
的事件

var map; 
 
var root; 
 
var geocoder; 
 
function initialize() { 
 
    geocoder = new google.maps.Geocoder(); 
 
     geocoder.geocode({ 'address': 'Ha noi, Vietnam'}, function(results, status) { 
 
\t \t \t \t root = results[0].geometry.location; 
 
\t \t \t \t map = new google.maps.Map(document.getElementById('map'), { 
 
\t \t \t \t zoom: 18, 
 
\t \t \t \t center: root, 
 
\t \t \t \t mapTypeId: google.maps.MapTypeId.ROADMAP 
 
\t \t \t \t }); \t 
 
\t \t \t \t 
 
\t \t \t \t 
 
\t \t \t \t var center = {latLng: root, style: 'ae', content: 'md'}; 
 

 
\t \t \t \t var zoomControlDiv = document.createElement('div'); 
 
    var zoomControl = new ZoomControl(zoomControlDiv, map); 
 

 
    zoomControlDiv.index = 1; 
 
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(zoomControlDiv); 
 
\t \t \t \t 
 
\t \t \t \t 
 
\t \t \t \t 
 
\t \t \t 
 
\t \t \t }); 
 
} 
 
function ZoomControl(controlDiv, map) { 
 
    
 
    // Creating divs & styles for custom zoom control 
 
    controlDiv.style.padding = '5px'; 
 

 
    // Set CSS for the control wrapper 
 
    var controlWrapper = document.createElement('div'); 
 

 
    controlDiv.appendChild(controlWrapper); 
 
    
 
    // Set CSS for the zoomIn 
 
    var txtAddress = document.createElement('input'); 
 
    //zoomInButton.innerHTML = '<br><img src=images/Plus.png title="Zoom In">'; 
 
    txtAddress.type="text"; 
 
    
 
    controlWrapper.appendChild(txtAddress); 
 
    
 
    var bttAddress = document.createElement('input'); 
 
    //zoomInButton.innerHTML = '<br><img src=images/Plus.png title="Zoom In">'; 
 
    bttAddress.type = "button"; 
 
    bttAddress.value= "Search"; 
 
    
 
    controlWrapper.appendChild(txtAddress); 
 
    controlWrapper.appendChild(bttAddress); 
 
    
 
    
 
    google.maps.event.addDomListener(txtAddress, 'change', function() { 
 

 
geocoder.geocode({'address': txtAddress.value}, function(results, status) { 
 
      if (status === 'OK') { 
 
      
 
      var marker = new google.maps.Marker({ 
 
       map: map, 
 
       position: results[0].geometry.location, 
 
\t \t \t title: txtAddress.value+' '+results[0].geometry.location 
 
      }); 
 
\t \t \t map.setCenter(results[0].geometry.location); 
 
\t \t \t 
 
\t \t \t 
 
      } else { 
 
      alert('Geocode was not successful for the following reason: ' + status); 
 
      } 
 
     }); 
 
    }); 
 
    
 
     google.maps.event.addDomListener(bttAddress, 'click', function() { 
 

 
geocoder.geocode({'address': txtAddress.value}, function(results, status) { 
 
      if (status === 'OK') { 
 
      
 
      var marker = new google.maps.Marker({ 
 
       map: map, 
 
       position: results[0].geometry.location, 
 
\t \t \t title: txtAddress.value+' '+results[0].geometry.location 
 
      }); 
 
\t \t \t map.setCenter(results[0].geometry.location); 
 
\t \t \t 
 
\t \t \t 
 
      } else { 
 
      alert('Geocode was not successful for the following reason: ' + status); 
 
      } 
 
     }); 
 
    }); 
 
    
 
    
 
} 
 
google.maps.event.addDomListener(window, 'load', initialize);

<!DOCTYPE HTML> 
 
<html> 
 
<head> 
 

 
<title>Google Maps API</title> 
 

 
<style type="text/css"> 
 
#map { 
 
\t width: 100%; 
 
\t height: 600px; 
 
} 
 
</style> 
 
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> 
 
<script type="text/javascript" src="init_map.js"></script> 
 
</head> 
 
<body> 
 
\t <div id="map"> 
 
\t </div> 
 
</body> 
 
</html>

来源

2017-02-27 09:21:20

谷歌地图搜索功能如何在我的自定义按钮点击javascript（无自动完成）触发

回答

相关问题