javascript阻止表单提交

时间:2013-10-05 07:33:47

标签: javascript html forms typeahead.js

我正在使用带有bootstrap3的Django并使用twitter的typeahead.js在我的表单上获得自动填充功能。

形式:

**

<div id="top" class="jumbotron">
  <div class="container">
    <h1 align="center">Home</h1>
    <h3>
        <form align="center" action="/search/" method="get" role="form">
    <input id="navPersonSearch" type="text" name="q" placeholder="Search for Actor/Actress" autocomplete="off">
      </form> 
   </h3>
  </div> <!-- /.container -->
</div> <!-- /.jumbotron -->

**

处理自动完成的

脚本:

<script type="text/javascript">

$(document).ready(function() {
  $("#navPersonSearch").typeahead({
    name: 'people',
    remote: 'name_autocomplete/?q=%QUERY'
  });
});

</script>

此表单没有提交按钮,因此您使用enter提交。注释掉脚本允许表单提交,但是脚本却没有。

1 个答案:

答案 0 :(得分:2)

这可能是因为提前修改了按键事件;我不确定,因为我没有使用它。但重新附加事件可能会解决您的问题。

尝试这样的事情:

$(document).ready(function() {
    $("#navPersonSearch").typeahead({
        name: 'people',
        remote: 'name_autocomplete/?q=%QUERY'
    }).keydown(function(e) {
        if (e.keyCode === 13) {
            $("form").trigger('submit');
        }
    });
});