使用 Enter 提交表单 - 无法使用箭头键选择之前输入的值 +进入

发布于 2024-12-06 17:10:05 字数 346 浏览 0 评论 0原文

我正在使用一个简单的 javascript 在按下 Enter 键时提交表单:

$("input").keypress(function (e) {
    if (e.which == 13) {
        $(this).closest("form").submit();
        return false;
    }
});

现在有一个问题。
浏览器会记住您之前在文本字段中输入的内容。

假设我从“自动完成”中选择了一些内容。我按下向下箭头键并按 Enter 键,想要选择之前输入的值。然后,由于按键事件,表单显然已提交。

有没有办法解决这个问题?

I'm using a simple javascript to submit a form when the Enter key is pressed:

$("input").keypress(function (e) {
    if (e.which == 13) {
        $(this).closest("form").submit();
        return false;
    }
});

Now there is a problem with this.
Browsers remember what you have typed in text fields before.

So lets say I chose something from the "auto completion". I hit my down arrow key and hit enter, wanting to select a previously entered value. Then the forms obviously submits, due to the keypress event.

Is there even a way to solve this?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

永不分离 2024-12-13 17:10:05

按键事件在浏览器填充输入字段之前触发。在用户按 Enter 之前跟踪字段中的内容,并且您可以判断值是否通过按键以外的其他方式更改。如果用户按 Enter 键选择自动填充值,则不会提交。

这至少适用于 FF 和 Chrome:

var typed = "";
$(document).ready(function(){
  $("#input-field").keypress(function (e) {
    if (e.which == 13) {        
      if($("#input-field").val() != typed) {
        $(this).closest("form").submit();
        //alert($("#input-field").val());
        return false 
      }
    }
    typed = $("#input-field").val();
  });
});

The keypress event is fired before the browser fills in the input field. Keep track of what's in the field before the user hits Enter, and you can tell if the value changed by some means other than a keypress. It won't submit if the user hit Enter to select an auto-filled value.

This works in at least FF and Chrome:

var typed = "";
$(document).ready(function(){
  $("#input-field").keypress(function (e) {
    if (e.which == 13) {        
      if($("#input-field").val() != typed) {
        $(this).closest("form").submit();
        //alert($("#input-field").val());
        return false 
      }
    }
    typed = $("#input-field").val();
  });
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文