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。