取消突出显示自动完成中的第一个突出显示的项目

Question

我在这里使用 PrimeFaces 5.1 中的 p:autoComplete 标签，但我无法从建议列表中删除第一个 highlighted/selected 项目。我怎样才能删除它？

Answer 1

由于您的 "problem" 来自这个特定的 line，

firstItem.addClass('ui-state-highlight');

这里发生的是当建议准备好显示时，脚本会突出显示列表的第一项，因此在您的情况下，您只需 "unhighlight" 该项目。

我创建了一个小函数，可以在您拥有的每个自动完成功能上执行此操作，您可以在 document.ready 或任何您认为合适的地方调用它：

function removeHighlightedFirstItem() {
  var oldAutoCompleteShowSuggestions = PrimeFaces.widget.AutoComplete.prototype.showSuggestions;

  PrimeFaces.widget.AutoComplete.prototype.showSuggestions = function(query) {     
     //calling original ShowSuggestions 
     oldAutoCompleteShowSuggestions.apply(this, [query]);
     //after ShowSuggestions
     //remove first item highlight 
     var firstItem = this.items.eq(0);
     firstItem.removeClass('ui-state-highlight');
  }
}

结果如下所示：

注意：通过向组件添加 autoHighlight = "false" 属性，您请求的功能可用于 5.1.5、5.0.14 和 5.2。

取消突出显示自动完成中的第一个突出显示的项目

Unhighlight first highlighted item from AutoComplete

primefaces

jsf-2