0

我遇到了谷歌地图位置的问题。当我们点击文本框下显示的结果时，表单被提交。当我们点击谷歌地图位置时，我们如何防止表单提交。

这是我的js：

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>

function initialize() {
  var map = new google.maps.Map(document.getElementById('map-canvas'), {
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  var defaultBounds = new google.maps.LatLngBounds(
      new google.maps.LatLng(-33.8902, 151.1759),
      new google.maps.LatLng(-33.8474, 151.2631));
  map.fitBounds(defaultBounds);

  var input = /** @type {HTMLInputElement} */(document.getElementById('target'));
  var searchBox = new google.maps.places.SearchBox(input);
  var markers = [];

  google.maps.event.addListener(searchBox, 'places_changed', function() {
    var places = searchBox.getPlaces();

    for (var i = 0, marker; marker = markers[i]; i++) {
      marker.setMap(null);
    }

    markers = [];
    var bounds = new google.maps.LatLngBounds();
    for (var i = 0, place; place = places[i]; i++) {
      var image = {
        url: place.icon,
        size: new google.maps.Size(71, 71),
        origin: new google.maps.Point(0, 0),
        anchor: new google.maps.Point(17, 34),
        scaledSize: new google.maps.Size(25, 25)
      };

      var marker = new google.maps.Marker({
        map: map,
        icon: image,
        title: place.name,
        position: place.geometry.location
      });

      markers.push(marker);

      bounds.extend(place.geometry.location);
    }

    map.fitBounds(bounds);
  });

  google.maps.event.addListener(map, 'bounds_changed', function() {
    var bounds = map.getBounds();
    searchBox.setBounds(bounds);
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

HTML 代码：

<div id="panel">
    <form action="">
      <input id="target" type="text" placeholder="Search Box">
      <input type="submit" value="submit" name="submit">
      </form>
    </div>
    <div id="map-canvas"></div>

任何人都可以帮助

4

1 回答 1

0

Hitting the enter key inside the text box will cause the form to get submitted. One way of getting around this issue would be to convert the submit to button and add an id to your form.

<form id="form1" action="">

 <input type="button" value="submit" name="submit" onclick="document.getElementById('form1').submit();">

This should prevent the page from sumitting on the enter key and submit only when you click the button.

于 2013-07-26T16:56:39.733 回答