使用键盘时，jQuery自动完成应跳过禁用元素

如果你看到这个小提琴演示 ，不是我做的，那我怎么能避免键盘可以关闭并选择禁用的元素？ 鼠标工作正常（无法选择它）但我可以用键盘下来并选择它，导致空搜索： – /

Fiddle演示来自这篇文章， 如何在jQuery自动完成列表中禁用元素

jQuery代码：

$(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"]; $("#tags").autocomplete({ source: availableTags, response: function (event, ui) { if (ui.content.length > 3) { while (ui.content.length > 3) { ui.content.pop(); } ui.content.push({ 'label': 'Please narrow down your search', 'value': '' }); } } }).data("ui-autocomplete")._renderItem = function (ul, item) { return $("
") .append("" + item.label + "") .appendTo(ul); }; }); 

Answer 1

自动填充“知道”基于每个li内部来突出显示项目。 您只需删除锚点即可禁用事件的键盘选择：

 .data("ui-autocomplete")._renderItem = function (ul, item) { var $el = $("
"); if (item.value === '') { $el.addClass("ui-state-disabled") .text(item.label); } else { $el.append("" + item.label + ""); } return $el.appendTo(ul); }; 

示例： http ： //jsfiddle.net/m6zvf/12/

Answer 2

作为安德鲁斯回答的替代方案，如果要保留将焦点包裹到第一个项目的向下键，则可以使用焦点事件在无法对焦的项目聚焦时触发第一个项目上的鼠标中心。

只需将下面的代码添加为焦点属性即可

工作JS FIDDLE

  focus: function(event, ui){ var curr = $(event.currentTarget).find('a.ui-state-focus'); if(curr.parent().hasClass('ui-state-disabled')) { event.preventDefault(); curr.parent().siblings().first().children('a').mouseenter(); } }