javascript - 在 Jquery 自动完成中通过箭头键导航下拉框时，不更新文本区域中的值

Question

我目前正在使用 jQuery 自动完成，正如问题所描述的，我不想更新我通过下拉列表中的箭头键选择的文本区域中的值。

例如。在我的文本区域中，当我输入“user1”时，将在下拉列表中过滤建议并出现结果。当我尝试在下拉列表中浏览不同结果时，我键入的值会更新为我通过箭头键导航的值。

如您所见，首先我输入一个单词“bala”(左侧的图像)，当我尝试浏览列表时，我的文本区域输入值将更新为我在下拉框中导航为“bala”的值@yahoo.com'(右侧图像)。我不希望该值被更新。仅当我单击“Enter”键或使用鼠标选择时，它才会更新。

我只想显示结果，而不是更新我在浏览不同项目时给出的值。非常感谢您的回答。

Answer 1

我认为这就是您要找的:-

Example Fiddle

$(function() {
   var availableTags = [
     "ActionScript",
     "AppleScript",
     "Asp",
     "BASIC",
     "C",
     "C++",
     "Clojure",
     "COBOL",
     "ColdFusion",
     "Erlang",
     "Fortran",
     "Groovy",
     "Haskell",
     "Java",
     "JavaScript",
     "Lisp",
     "Perl",
     "PHP",
     "Python",
     "Ruby",
     "Scala",
     "Scheme"
   ];

   // don't navigate away from the field on tab when selecting an item

   $("#tags").autocomplete({
     source: availableTags,
     focus: function() {
       // prevent value inserted on focus
       // **This is where you should add**
       return false;
     },
   });
 });

您可以从 Jquery 中找到示例:- jQuery Autocomplete multiple-remote

检查焦点上的功能。