当前位置：文江博客话题详情

停止“输入”使用 jquery ui 自动完成小部件时的关键提交表单

发布于 2024-12-02 04:05:15 字数 285 浏览 2 评论 0原文

我有一个使用 jquery 自动完成 UI 插件的表单， http://jqueryui.com/demos/autocomplete/ ，一切都很顺利，除了当您按 Enter 键在自动完成列表中选择一个项目时，它会提交表单。

我在 .NET Webforms 站点中使用它，因此可能存在与 .NET 注入的表单关联的 javascript 处理，该处理会覆盖 jQuery 内容（我在这里推测）。

原文

分享到QQ

分享到微博

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

发布评论

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

爱你是孤单的心事 2024-12-09 04:05:15

您可以在其上使用事件处理程序。

$("#searchTextBox").keypress(function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if(code == 13) { //Enter keycode
        return false;
    }
});

请参阅： jQuery 事件按键：按下了哪个键？

还：http://www.cambiaresearch.com/c4/702b8cd1-e5b0-42e6-83ac-25f0306e3e25/javascript-char-codes-key-codes.aspx 查看键码列表

You can use an event handler on it.

$("#searchTextBox").keypress(function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if(code == 13) { //Enter keycode
        return false;
    }
});

see: jQuery Event Keypress: Which key was pressed?

also: http://www.cambiaresearch.com/c4/702b8cd1-e5b0-42e6-83ac-25f0306e3e25/javascript-char-codes-key-codes.aspx for list of keycodes

回复收藏 0 原文

夜司空 2024-12-09 04:05:15

$("#autocomplete_field_id").keypress(function(event){
  var keycode = (event.keyCode ? event.keyCode : event.which);
  if (keycode == '13') {
    event.preventDefault();
    event.stopPropagation();    
  }
});

$("#autocomplete_field_id").keypress(function(event){
  var keycode = (event.keyCode ? event.keyCode : event.which);
  if (keycode == '13') {
    event.preventDefault();
    event.stopPropagation();    
  }
});

回复收藏 0 原文

桃扇骨 2024-12-09 04:05:15

一种方法是处理按键，如果是回车键则忽略它。

回复收藏 0 原文

怀念你的温柔 2024-12-09 04:05:15

您可以尝试以下操作：

<input id="MyTextBox" type="text" onkeydown="return (event.keyCode!=13);" />

这将仅在输入文本框中禁用 Enter 键

You could try this:

<input id="MyTextBox" type="text" onkeydown="return (event.keyCode!=13);" />

This will disable the Enter key only on the input text box

回复收藏 0 原文

不再见 2024-12-09 04:05:15

答案王牌帖子帮助我解决了我的问题。不过您应该注意到，ace 提供的代码必须存在于 $('input').autocomplete(*****) 之前，否则您将不会收到任何效果。

回复收藏 0 原文

魂ガ小子 2024-12-09 04:05:15

如果您仍希望按 Enter 键提交，则在进行自动完成选择后，

if (evt.keyCode === 13 && !$('.ui-autocomplete').is(':visible')) {
   $('.ui-button:first').click();
}
evt.stopPropagation();

If you still want the enter key to submit, after the autocomplete selection is made,

if (evt.keyCode === 13 && !$('.ui-autocomplete').is(':visible')) {
   $('.ui-button:first').click();
}
evt.stopPropagation();

回复收藏 0 原文

你爱我像她 2024-12-09 04:05:15

一行代码：

$("#searchField").on('keypress', (event) => event.which !== $.ui.keyCode.ENTER);

这里有 3 件事与接受的答案不同：

jQuery 标准化 event.which，因此无需测试 event.keyCode 和 event .which.
由于您显然使用的是 jQuery UI，因此您可以通过 $.ui.keyCode 访问命名键代码，这使其更具可读性。
ES6 箭头函数语法进一步简化了代码。

One line of code:

$("#searchField").on('keypress', (event) => event.which !== $.ui.keyCode.ENTER);

3 things that are different here than the accepted answer:

jQuery normalizes event.which, so no need to test for event.keyCode and event.which.
Since you're obviously using jQuery UI, you have access to named key codes via $.ui.keyCode, which makes it more readable.
The ES6 arrow function syntax further simplifies the code.

回复收藏 0 原文

~没有更多了~