jQuery UI Autocomplete plug-in kullanıyorum. Bir şekilde açılan sonuçlarında arama karakter dizisi vurgulamak için var mı?

Eğer veri var ise, örneğin: "foo bar" ve arama için "" anlıyorum " . foo ^strong>foobar" açılır.

Evet, eğer sen-yama maymun otomatik tamamlama yapabilirsiniz.

Otomatik tamamlama widget v1 dahil.JQuery UI, önerileri açılan 8rc3 otomatik tamamlama widget _renderMenu işlevi oluşturulur. Bu işlevi aşağıdaki gibi tanımlanır:

_renderMenu: function( ul, items ) {
    var self = this;
    $.each( items, function( index, item ) {
        self._renderItem( ul, item );
    });
},

_renderİtem işlevi bu gibi tanımlanır:

_renderItem: function( ul, item) {
    return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( "<a>"   item.label   "</a>" )
        .appendTo( ul );
},

Bu yüzden yapmanız gereken şey istenen etkiyi üretir kendi yaratılış ile _renderİtem fn değiştirin. Bu teknik, bir kütüphane, bir iç işlevi yeniden tanımlanması, monkey-patching denir öğrendim. Yaptım işte nasıl:

  function monkeyPatchAutocomplete() {

      // don't really need this, but in case I did, I could store it and chain
      var oldFn = $.ui.autocomplete.prototype._renderItem;

      $.ui.autocomplete.prototype._renderItem = function( ul, item) {
          var re = new RegExp("^"   this.term) ;
          var t = item.label.replace(re,"<span style='font-weight:bold;color:Blue;'>"   
                  this.term   
                  "</span>");
          return $( "<li></li>" )
              .data( "item.autocomplete", item )
              .append( "<a>"   t   "</a>" )
              .appendTo( ul );
      };
  }

Şimdi, bu, çünkü kesmek

• regexp n her öğe listesi ile paylaşması için yarattı. Bu regexp n yeniden kullanılan tüm öğeler için olmalı.

• css sınıf biten bölümleri biçimlendirmek için kullanılan yok. Bir satır içi stil.
  Bu eğer aynı sayfada birden fazla autocompletes olsaydı, aynı tedavi olsun diye, hepsi anlamına gelir. Css stili o çözecek.

...ama ana tekniği göstermektedir, ve temel gereksinimleri için çalışıyor.

örnek çalışma: http://jsbin.com/ezifi/4

Eşleşen dizelerin büyük / küçük harf korumak için yazılan karakterleri harf kullanarak aksine, bu satırı kullanımı:

var t = item.label.replace(re,"<span style='font-weight:bold;color:Blue;'>"   
          "$&"   
          "</span>");

Orijinal kodu yukarıdaki itibaren, diğer bir deyişle, sadece "$&" this.term değiştirmeniz gerekiyor.

EDİT
Yukarıdaki değişikliklerhersayfasında otomatik tamamlama widget. Eğer sadece birini değiştirmek isterseniz, bu soruya bakın:
How to patch *just one* instance of Autocomplete on a page?