Google Maps API返回“未定義”

Question

我正在向Google Maps Geocoding API查詢字符串。 我在控制台中看到一個返回值，因此我知道連接正確，但是if語句中的內容返回“ Undefined”。 關於為什么會這樣的任何想法？

$(document).ready(function(){

      // Search Submit  
      $("#search").submit(function(event){
            event.preventDefault("", function(){
                  //
                  });

            name = $("#search-name").val();
            console.log("Search term at submit is: "+name);

            // Send to Google Geocoding API

            var geocoder = new google.maps.Geocoder();

            geocoder.geocode({ 
                        address : name
                  }, function(results, status){

                        if (status == google.maps.GeocoderStatus.OK) {

                              console.log("results after query: "+ results.formatted_address + "\n" + results.length + " QTY Posts");
                  }

            );
      });
});

Answer 1

結果是數組不是對象。 對於對象，請使用position或使用foreach讀取所有返回值。

嘗試將results.formatted_address更改為results [0] .formatted_address。

 var map; var addressField; var geocoder; $(document).ready(function () { // Define map options var mapOptions = { center: new google.maps.LatLng(57.698254, 12.037024), zoom: 16, mapTypeId: google.maps.MapTypeId.HYBRID, panControl: true, zoomControl: true, mapTypeControl: true, scaleControl: true, streetViewControl: true, overviewMapControl: true }; // Define map map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); // Define Gecoder geocoder = new google.maps.Geocoder(); // Init searchbox initSearchBox(); }); function initSearchBox() { // Add searchbox var searchControlDiv = document.createElement('div'); var searchControl = new SearchControl(searchControlDiv, map); searchControlDiv.index = 1; map.controls[google.maps.ControlPosition.TOP_CENTER].push(searchControlDiv); } function SearchControl(controlDiv, map) { // Set CSS styles for the DIV containing the control // Setting padding to 5 px will offset the control // from the edge of the map. controlDiv.style.padding = '5px'; // Set CSS for the control border. var controlUI = document.createElement('div'); controlUI.style.backgroundColor = 'white'; controlUI.style.borderStyle = 'solid'; controlUI.style.borderWidth = '2px'; controlUI.style.cursor = 'pointer'; controlUI.style.textAlign = 'center'; controlUI.title = 'Sök ex: gatunamn, stad'; controlDiv.appendChild(controlUI); // Create the search box var controlSearchBox = document.createElement('input'); controlSearchBox.id = 'search_address'; controlSearchBox.size = '80'; controlSearchBox.type = 'text'; // Initiat autocomplete $(function () { $(controlSearchBox).autocomplete({ source: function (request, response) { if (geocoder == null) { geocoder = new google.maps.Geocoder(); } geocoder.geocode({ 'address': request.term }, function (results, status) { if (status == google.maps.GeocoderStatus.OK) { var searchLoc = results[0].geometry.location; var lat = results[0].geometry.location.lat(); var lng = results[0].geometry.location.lng(); var latlng = new google.maps.LatLng(lat, lng); var bounds = results[0].geometry.bounds; console.log(results) geocoder.geocode({ 'latLng': latlng }, function (results1, status1) { if (status1 == google.maps.GeocoderStatus.OK) { if (results1[1]) { response($.map(results1, function (loc) { return { label: loc.formatted_address, value: loc.formatted_address, bounds: loc.geometry.bounds } })); } } }); } }); }, select: function (event, ui) { var pos = ui.item.position; var lct = ui.item.locType; var bounds = ui.item.bounds; if (bounds) { map.fitBounds(bounds); } } }); }); // Set CSS for the control interior. var controlText = document.createElement('div'); controlText.style.fontFamily = 'Arial,sans-serif'; controlText.style.fontSize = '12px'; controlText.style.paddingLeft = '4px'; controlText.style.paddingRight = '4px'; controlText.appendChild(controlSearchBox); controlUI.appendChild(controlText); } 

 html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map_canvas { height: 100% } 

 <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> <div id="map_canvas" style="width:100%; height:100%;"></div>