2013-07-26 62 views
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> 

任何人都可以就

+0

等待很長時間後沒有得到任何答案 –

回答

0

擊中文本框內輸入鍵會得到提交表單幫助。解決此問題的一種方法是將提交轉換爲按鈕並將ID添加到您的表單中。

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

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

這應該防止頁面在輸入鍵上提交併且只在您點擊按鈕時才提交。

+0

謝謝!我們也需要不點擊按鈕就像輸入位置並單擊 –