提交建议选择的地理完成表格

Submitting geocomplete form on suggestion select

本文关键字:表格 选择 提交      更新时间:2024-02-28

我对JS还很陌生,所以我有点困惑,为什么这不起作用。基本上,我使用地理完成jQuery插件来填充带有坐标和地址的表单。然后,一旦用户选择了目的地,我想汇总表单。

 <form action="search.php" method="post" id="searchForm">
        <input id="geocomplete" type="text" placeholder="Where are you going to?" size="35" />
        <input name="lat" type="hidden" value="">
        <input name="lng" type="hidden" value="">
        <input name="formatted_address" type="hidden" value="" id="address">
    </form>

这将是我调用的脚本来启动表单插件(有效),以及在插件更改地址值后提交表单的脚本:

<script type="text/javascript">
window.onload= function () {
    if(window.addEventListener) {
        document.getElementById('address').addEventListener('change', doIt, false);
    } else if (window.attachEvent){
        document.getElementById('address').attachEvent("onchange", doIt);
    }
    function doIt(){
        document.getElementById("searchForm").submit();
    }
}
$("input").geocomplete({ details: "form" }); 

</script>

我不明白为什么这不起作用,因为值确实发生了变化。非常感谢!

change事件仅在通过直接用户输入进行更改时触发,而不是在脚本更改输入值时触发。

使用该插件提供的事件,如您已经链接到的页面上所述。

这里是jquery的另一个解决方案。当点击自动填充地址或用户用箭头键选择地址并点击回车键时,这将强制提交。有1.5秒的延迟,允许地理编码库填充隐藏字段。这种所需的延迟就是'onchange="this.form.submit()"对我不起作用的原因。

  /*
    submit form when user clicks or hits enter on auto suggest 
    must sleep for 2 seconds to allow the geocoding library to update the hidden fields
  */
  $(document).ready(function(){
    $('#geocomplete').change(function(){
      setTimeout(function() {
        $('#find').click()     
      }, 1500);
    });
  });
  $(document).ready(function(){
    $('#geocomplete').keydown(function(event){
      if (event.keyCode == 13) {
        setTimeout(function() {
          $('#find').click()     
        }, 1500);
        return false;
      }
    });
  });
$(function(){
    $(".geocomplete")
       .geocomplete({details:"form"})
       .bind("geocode:result", function(event, result){$(".searchForm").submit();
        });
    });