Question

使用Google Map API自动填写地址文本字段时出现javascript错误。

当我加载页面时，它会发出以下错误（在Safari错误控制台中）：

[Error] TypeError: 'null' is not an object (evaluating 'a[PB]')

这是我的代码：

<!DOCTYPE html>
<html>
  <head>
    <meta charset='UTF-8'>
    <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'>
    <meta content='IE=7' http-equiv='X-UA-Compatible'>
    <meta content='up,to,8,keywords,come,here' name='keywords'>
    <script src="/javascripts/jquery.js?1386116953" type="text/javascript"></script>
    <script src="/javascripts/jquery-ui.js?1386116989" type="text/javascript"></script>
    <script src="/javascripts/jrails.js?1386116953" type="text/javascript"></script>
    <script src="/javascripts/application.js?1386116989" type="text/javascript"></script>
    <script src="/javascripts/jquery.dataTables.js?1386116989" type="text/javascript"></script>
        <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
        <script>

    var placeSearch, autocomplete;
    var componentForm = {
      subpremise: 'short_name',
      street_number: 'short_name',
      route: 'long_name',
      locality: 'long_name',
      administrative_area_level_1: 'short_name',
      country: 'long_name',
      postal_code: 'short_name'
    };

    function initialize()
    {
      autocomplete = new google.maps.places.Autocomplete( (document.getElementById('autocomplete')), { types: ['geocode'] });
      google.maps.event.addListener(autocomplete, 'place_changed', function() { fillInAddress(); });
    }

    function fillInAddress()
    {
      // Get the place details from the autocomplete object.
      var place = autocomplete.getPlace();

      // Get each component of the address from the place details
      // and fill the corresponding field on the form.
      var result = {};
      for (var i = 0; i < place.address_components.length; i++) {
        var addressType = place.address_components[i].types[0];
        if (componentForm[addressType]) {
          var id = addressType;
          var val = place.address_components[i][componentForm[id]];
          result[id] = val;
        }
    //    alert(JSON.stringify(result));
    //    document.getElementById(id).value = val;
      }
    }

    function geolocate() {
      if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
          var geolocation = new google.maps.LatLng(
              position.coords.latitude, position.coords.longitude);
          autocomplete.setBounds(new google.maps.LatLngBounds(geolocation,
              geolocation));
        });
      }
    }
        </script>
  </head>
  <body onload='javascript:initialize();'>
    <div class='Page' id='page'>
      <div class='Content_Container'>
        <div class='form-style'>
          <div id='button'>
            <form action="/p/1" class="edit_p" id="edit_p_1" method="post"><div style="margin:0;padding:0;display:inline"><input name="_method" type="hidden" value="put" /></div>
              <p class='mandatory'>* All fields are mandatory.</p>
              <p><strong>Address</strong></p>
              <input name="autocomplete" type="text" />
              <input id="p_address" name="p[address]" type="hidden" value="Macquarie St" />
              <input id="p_state" name="p[state]" type="hidden" value="NSW" />
              <input id="p_country" name="p[country]" type="hidden" value="Australia" />
              <p class='list'><a href="/p">Back to List</a></p>
              <p><input class="submit" id="submit" name="commit" type="submit" value="Save" /></p>
            </form>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>

有什么想法吗？

WH

Google Map API自动完成类型错误“null”不是对象

0 个答案: