jQuery自动完成：根据字段中的文本更改文本样式

Question

因此，我有一个输入，我集成了jQuery自动完成。我不知道该如何解释。我想，如果键入更改自动完成的文本的样式，像谷歌已经为它的自动完成：

注意，在自动完成，“stackover”比的其余打火机字。

这是所使用的CSS文本：.ui-menu .ui-menu-item a

有谁知道如何做到这一点？

非常感谢

Answer 1

你可以认购open事件，并附加跨度周围的匹配项，让你可以据此设定样式：

$('#q').autocomplete({ 
    source: ['stackoverflow', 'stackoverflow careers', 'stackoverflowerror', 'stackoverflow api', 'stackoverflow podcast'], 
    open: function(e, ui) { 
     var data = $(this).data('autocomplete');    
     data.menu.element.find('li').each(function() { 
      var $this = $(this); 
      var matched = data.term; 
      var rest = $this.text().replace(matched, ''); 
      var template = $('<span/>', { 
       'class': 'ui-found', 
       'text': matched 
      }).after($('<span/>', { 
       'text': rest  
      })); 
      $this.html(template); 
     }); 
    } 
}); 

这里有一个live demo。