jquery，谷歌地圖地理編碼後提交表格

我有一個表格，收集一個人的地址。當他們點擊提交時，我想對他們的地址進行地理編碼，並使用它來填充lat和lng字段。以下是我現在正在做的是基於這裏的第二個答案submit form does not stop in jquery ajax call jquery，谷歌地圖地理編碼後提交表格

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     var geocoder; 
     var address; 
     $('#theform').submit(function() { 
      geocoder = new google.maps.Geocoder(); 
      address = $('#id_street').val() + " " + $('#id_street2').val() + " " + $('#id_city').val() + ", " + $('#id_state').val() + " " + $('#id_zip').val(); 
      geocoder.geocode({ 'address': address}, function(results, status) { 
       if (status == google.maps.GeocoderStatus.OK) { 
       $('#id_lat').val(results[0].geometry.location.lat().toFixed(6)); 
       $('#id_lng').val(results[0].geometry.location.lng().toFixed(6)); 
       $('#theform').unbind('submit'); 
       $('#theform').submit(); 
       } else { 
       $('#theform').unbind('submit'); 
       $('#theform').submit(); 
       } 
      }); 
      return false; 
     }); 
    }); 
</script>

和形式

<form method="POST" id="theform" action=""> 
    <li><label for="id_street">Street</label> <input id="id_street" type="text" name="street" value="3520 Lebon Dr." maxlength="100" /></li> 
    <li><label for="id_street2">Street2 (optional)</label> <input id="id_street2" type="text" name="street2" maxlength="100" /></li> 
    <li><label for="id_city">City</label> <input id="id_city" type="text" name="city" value="San Diego" maxlength="50" /></li> 
    <li><label for="id_state">State</label> <select name="state" id="id_state"> 
    ...a bunch of state options... 
    <li><label for="id_zip">Zip Code</label> <input id="id_zip" type="text" name="zip" value="92122" maxlength="30" /></li> 
    <label for="id_lat">Latitude</label><input type="text" name="lat" value="0.000000" id="id_lat" /> 
    <label for="id_lng">Longitude</label><input type="text" name="lng" value="0.000000" id="id_lng" /> 
</form>

lat和液化天然氣領域得到填補很好，但形式實際上並沒有得到提交由$（'＃theform'）。submit（）。要實際提交表單，您必須再次點擊提交。

任何關於我在做什麼的想法都是錯誤的？如果有人問我確實想提交表格，即使地理編碼不成功，那麼我將使用geopy對地址服務器端進行地理編碼。

編輯：好了，所以我做了一個非常簡單的例子，無法獲得提交在所有的工作：

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 

<script type="text/javascript"> 
$(function() { 
    $('#subby').click(function() { 
     $('#theform').submit(); 
    }); 
}); 

</script> 

</head> 
<body> 
<a href="#" id="subby">Submit</a> 
<form id="#theform" action="javascript:alert('success!');"> 
     <input type="submit" /> 
</form> 
</body> 
</html>

我預計點擊鏈接時提交，你會得到一個alertbox就像當你點擊提交按鈕，但事實並非如此。我在做什麼錯誤提交？

來源

2011-06-01 joshcartme

你通過調試器運行它嗎？第一次運行方法'return false;'可能會被中止，這會停止提交。 – 2011-06-01 20:06:36

我在返回false和$（'＃theform'）上放置了一個斷點。unbind（'submit'）;在if中。它首先觸發返回false，但後來（大概是當異步調用谷歌回來）擊中另一個斷點後，它應該去$（'＃theform'）。submit（）。該表格仍然沒有提交。 – joshcartme 2011-06-01 20:14:21

所以它確實打了'$（'＃theform'）。submit（）'？有沒有一種方法可以編輯你的代碼，以便'return false'在'if'或'else'中。雖然它回到了前一個斷點，但我猜測命中'return false'會讓程序混淆 – 2011-06-01 20:32:55

我只是想通了。我無意中忽略了我發佈的表單中的提交按鈕。它被命名爲提交。顯然，這件事情爲jquery（謝謝你在這裏：jQuery doesn't submit a form）。我發佈的簡單示例仍然不起作用，我不確定爲什麼，但是我的實際問題已解決。

來源

2011-06-01 21:02:30 joshcartme

jquery，谷歌地圖地理編碼後提交表格

回答

相關問題