Question

我已经建立了一个监听器来防止表单在特殊情况下提交。

我正在使用谷歌地图自动完成api，基本上我不想在用户按Enter键时提交表单，并显示“推荐结果框”。当用户按Enter键从下拉框中选择一个值而不是提交表单时。

我已经构建了一个正确捕获事件的侦听器，但我不知道如何阻止提交表单。

$('body').live('keydown', function(e) {
    if($(".pac-container").is(":visible") && event.keyCode == 13) {
        e.preventDefault(); // Prevent form submission
        }
    });

我尝试使用e.preventDefault（）;但它仍然提交表格。表单ID为：updateAccountForm

如何防止它发生？

编辑：我必须指出，直接在搜索输入上搜索按键似乎与Google API冲突，使自动完成功能失效。所以没有$('input#search') keydown / keypress是可能的

Answer 1

解决方案实际上非常简单。然而，所有听众似乎都失败了：

onkeydown="if($('.pac-container').is(':visible') && event.keyCode == 13) {event.preventDefault();}"

直接向输入做了诀窍。

Answer 2

我认为你应该尝试使用这样的东西......包装检查容器的可见性

$('body').keypress(function(e) 
{
  if (e.keyCode == '13') {
     e.stopPropagation()

   }
});

文章here有一个很好的解释。

Answer 3

试试这个

$('body').live('keydown', function(e) {
    if($(".pac-container").is(":visible") && e.keyCode == 13) {
        e.stopPropagation(); // Prevent form submission
    }
});

请参阅e。keyCode而不是event。keyCode 和e.stopPropagation()代替e.preventDefault

Answer 4

要阻止回车键在Google Places API autocomplete's text field上提交表单，我需要一个 keydown 处理程序...

$(document).on('keydown', '#my-autocomplete', function(e) {
    if (e.which == 13) {
      $('#my-autocomplete').show();
      return false;
    }
});

...以及在实例化后自动完成时附加的 place_changed 侦听器：

var my_autocomplete = new google.maps.places.Autocomplete(/*...*/);
google.maps.event.addListener(my_autocomplete, 'place_changed', function() {
    var place = my_autocomplete.getPlace();
    if (!place.place_id) { return; }
});

不重要，但它可能，这个解决方案在jQuery Mobile网络应用程序中运行。

Answer 5

阻止表单提交

 <form method="post">
    <input type="text" id="search">

    </form>

    <script>
        $('input#search').keypress(function(e) {
          if (e.keyCode == '13') {
             e.preventDefault();

           }
        });
    </script>

Answer 6

相关问题：Google maps Places API V3 autocomplete - select first option on enter

当我使用Google地图自动填充框时，我想让'enter'和'tab'选择第一项。我按照上面链接的@amirnissim的解决方案，如果从输入元素按下输入/选项卡，则模拟向下箭头键按下。

当我编码时，我没有将这些输入作为表单的一部分。我不确定如何阻止表单发送输入密钥（实际上这就是我发现这个问题的方式）但是当我使用自动填充时，我的输入不是表单的一部分。

防止表单提交字段输入密钥keydown？

6 个答案: