javascript 阻止表单提交

Question

我将 Django 与 bootstrap3 结合使用，并使用 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>

此表单没有提交按钮，因此您按回车键提交。注释掉脚本允许表单提交，但使用脚本则不能。

Answer 1

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

尝试这样的事情:

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