jquery-locationpicker-plugin自动完成无法正常工作

Question

我使用此软件包允许我的用户查找地址并填充字段。

http://logicify.github.io/jquery-locationpicker-plugin/#

自动完成功能不适用于该示例。我已将我的api密钥添加到脚本中。

<script type="text/javascript" src="http://maps.google.com/maps/api/js?&libraries=places&key=keyremoved"></script>

代码

<a data-target="#us6-dialog" data-toggle="modal">Click hear to open dialog</a>
<div id="us6-dialog" class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
        <div class="form-horizontal" style="width: 550px">
          <div class="form-group">
            <label class="col-sm-2 control-label">Location:</label>

            <div class="col-sm-10">
              <input type="text" class="form-control" id="us3-address" />
            </div>
          </div>
          <div class="form-group">
            <label class="col-sm-2 control-label">Radius:</label>

            <div class="col-sm-5">
              <input type="text" class="form-control" id="us3-radius" />
            </div>
          </div>
          <div id="us3" style="width: 100%; height: 400px;"></div>
          <div class="clearfix">&nbsp;</div>
          <div class="m-t-small">
            <label class="p-r-small col-sm-1 control-label">Lat.:</label>

            <div class="col-sm-3">
              <input type="text" class="form-control" style="width: 110px" id="us3-lat" />
            </div>
            <label class="p-r-small col-sm-2 control-label">Long.:</label>

            <div class="col-sm-3">
              <input type="text" class="form-control" style="width: 110px" id="us3-lon" />
            </div>
          </div>
          <div class="clearfix"></div>
          <script>
            $(document).ready(function() {
              $('#us3').locationpicker({
                location: {
                  latitude: 46.15242437752303,
                  longitude: 2.7470703125
                },
                radius: 300,
                inputBinding: {
                  latitudeInput: $('#us3-lat'),
                  longitudeInput: $('#us3-lon'),
                  radiusInput: $('#us3-radius'),
                  locationNameInput: $('#us3-address')
                },
                enableAutocomplete: true,
                markerIcon: 'http://www.iconsdb.com/icons/preview/tropical-blue/map-marker-2-xl.png'
              });
              $('#us6-dialog').on('shown.bs.modal', function() {
                $('#us3').locationpicker('autosize');
              });
            });

          </script>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
    <!-- /.modal-content -->
  </div>
  <!-- /.modal-dialog -->
</div>
<!-- /.modal -->