Firefox自动完成“输入”按键自动完成触发在文本框中输入答案

【问题标题】：firefox autocomplete 'enter' keypress on autocomplete triggering enter on textboxFirefox自动完成“输入”按键自动完成触发在文本框中输入
【发布时间】：2012-03-14 22:54:09
【问题描述】：

我有一个包含一些常见字段的表单，例如“电子邮件”。我有捕获返回键 (13) 并提交表单的 javascript，但是在主机面板上使用 defaultButton 属性时观察到相同的效果。

如果用户在 IE 上并正在输入他的电子邮件地址，然后通过按 ENTER 从浏览器的内联自动完成中选择一个项目，则不会将按键发送到 Javascript。好。

然而，在 Firefox 上，文本框收到 ENTER 键并想要提交表单，但该表单并不完整。

除了禁用自动完成功能之外，有谁知道如何阻止这种情况？我想不出一种方法来检测按键实际上来自自动完成列表框。

我正在使用 asp.net 和 jQuery。

编辑 - 澄清：在自动完成中的项目上按 Enter 不应提交表单。 IE 行为是正确的（一次！）。

我的事件处理程序本身就是：

上键（也尝试过按键）- if(e.which == 13) submitForm();

问题是，我不知道如何检测到 ENTER 按下实际上来自自动完成控件

【问题讨论】：

这对您有帮助吗？ stackoverflow.com/questions/270494/…
我认为问题源于 e 处理程序。您可以提供帮助的第一条评论。
你能显示保存输入的javascript吗？键在浏览器上的处理方式不同
我想我不是很清楚。 IE 行为是正确的。不正确的行为是，在 Firefox 上，如果我按 Enter 选择自动完成条目，它也会提交表单。请查看我的编辑。
您找到解决方案了吗？

标签： jquery asp.net autocomplete webforms

【解决方案1】：

您可以将字段的值存储在 key down 上，然后在 key up 上再次检查。如果一键按下后字符串中有超过 1 个字符不同，则可以安全地假定选择了自动完成项并忽略输入。

这不起作用的唯一情况是当您有一个字段，例如：email@test.co，并且您选择了一个只添加了最后一个字母的自动完成项目，回车键会无意中提交表单。

希望这至少能让我们开始。我也在尝试找出一个防弹解决方案。如果我找到了，我会更新。

编辑

上面的螺丝。整理出来。如果您检查上键时的回车键，并且两个键下/上时输入字段的值不同，则可以假设选择了自动完成项。

var loginCurrentInput = '';

$('input').keydown(function(e) {

  loginCurrentInput = $(this).val();

}

$('input').keyup(function(e) {

  //if enter key pressed
  if(e.keyCode == 13) {

    //check for changed input value
    if($(this).val() != loginCurrentInput) {

      loginCurrentInput = $(this).val();
      return false;

    }

    $('#button').trigger('click');

  }

}

【讨论】：

【解决方案2】：

在输入键时，您可以检查当前焦点的元素是什么：

$("*:focus")

如果元素没有附加未完成，那么您可以提交表单。看看： How to select an element that has focus on it with jQuery

【讨论】：

【解决方案3】：

您可以使用两种（干净的）技巧：

1.) [Enter] 不会生成input event ...

2.) 具有自动完成功能的 keydown 和 keyup 是“同步的”

解决方案（我将两者结合起来）：

在 [enter] keydown 期待真正的按键点击 (true_enter=true) 和“setTimeout”（0 延迟！）提交时检查它是否仍然是 true_enter

开启keyup 和input 清除true_enter=false

说明：

使用自动完成，keydwon 和 keyup 是同步的，或者 - 当排队时 - 直接在后面；与keydwon 和输入事件相同

使用 setTimeout，您可以将输入操作置于这些事件之后。

真正的按键（几乎）从未如此快速地实现这一目标。我有 20 比 1，努力。

缺点：

自动测试会有问题。

我在coffeescript中的解决方案：（抱歉我的javascript不好）

        .on_key("enter", =>             # is what it sounds like
            @true_enter=true
            @defer  =>                  # setTimeout
                if @true_enter
                    #submit ...

        .on("keyup input",  =>
            @true_enter=false
        )

【讨论】：