İlk veya son kullanıcı adı tarafından arama ve uygulamak için jQuery UI autocomplete widget kullanarak içine arıyorum. Varsayılan otomatik tamamlama karakter dizisi tarafından kelime kelime oluşun olursa olsun arar gibi görünüyor. Bu yüzden bu tür veri varsa: javascript, asp, haskell ve her üç alacak 'as' yazın. En az kelime başına maç istiyorum. Yukarıdaki örnek sadece 'asp' olsun. Bir şekilde bunu yapmak için otomatik tamamlama widget yapılandırma var mı?

Sonuçta Gmail gibi match by beginning of first or last name daha da iyi olurdu.

Not: Bu özellikle jQuery UI widget kullanarak. yapmak için bir yol bulmaya çalışıyorum Zaten projemde jQuery UI kullanıyorum beri, onunla sopa ve benim web uygulaması için ek kütüphaneler ekleyerek deneyin planlıyorum.

JQuery UI v1.Kabul eder ya da bir dize, bir dizi ya da bir geri çağırma işlevi olan* *14 bir seçenek 8rc3, the autocomplete widget. Eğer bir dize ise, otomatik tamamlama yapar bu URL seçenekleri almak için bir öneri. Bir dizi, bir otomatik tamamlama arama senin de belirttiğin gibi, bu dizi açısından herhangi bir pozisyonda yazılan karakter varlığı için yapar. Son varyant - geri arama fonksiyonu.

Otomatik tamamlama belgeleri:

Üçüncü değişim, geri, en esneklik sağlar, ve otomatik tamamlama için herhangi bir veri kaynağına bağlanmak için kullanılabilir. Geri iki argüman alır:

Tek bir özelliği ile request nesne•, "şu anda Metin Giriş değeri ifade eder.", terim Kullanıcı girdiğinde örneğin, "new yo" otomatik tamamlama yapmak için ayarlanmış bir şehir alanında, request.term. "new yo".
response bir işlevi, veri içeren tek bir değişkeni kullanıcı için önermek için bekleyen bir geri arama•. Bu veri sağlanan terimine göre filtre edilmeli ve biçimi basit yerel veri için izin verilen bir dizi olmalı: Dize Dizisi veya Dizi Nesne etiket//değeri ile hem de özellikleri.

Örnek kod:

var wordlist= [ "about", "above", "across", "after", "against",
                "along", "among", "around", "at", "before", 
                "behind", "below", "beneath", "beside", "between", 
                "beyond", "but", "by", "despite", "down", "during", 
                "except", "for", "from", "in", "inside", "into", 
                "like", "near", "of", "off", "on", "onto", "out", 
                "outside", "over", "past", "since", "through", 
                "throughout", "till", "to", "toward", "under", 
                "underneath", "until", "up", "upon", "with", 
                "within", "without"] ; 

$("#input1").autocomplete({
    // The source option can be an array of terms.  In this case, if
    // the typed characters appear in any position in a term, then the
    // term is included in the autocomplete list.
    // The source option can also be a function that performs the search,
    // and calls a response function with the matched entries.
    source: function(req, responseFn) {
        var re = $.ui.autocomplete.escapeRegex(req.term);
        var matcher = new RegExp( "^"   re, "i" );
        var a = $.grep( wordlist, function(item,index){
            return matcher.test(item);
        });
        responseFn( a );
    }
});

Birkaç anahtar nokta:

• 8 ** dediğimizkaçararama terimi metin kullanıcı tarafından yazılan düzenli-anlamlı herhangi bir hüküm düz metin olarak kabul edilir. Örneğin, nokta (.) normal ifade. anlamlı Otomatik tamamlama, kaynak kodu okuyarak bu escapeRegex fonksiyon öğrendim.
• new Regexp() ile hat. Yazılan karakterler istediğin dizi, dönem başında görünür tek maç olacak ima ^ (Uzatma), regexp ile bir başlangıç belirtir. Ayrıca "" büyük / küçük harf duyarlı eşleşme anlamına gelir. seçeneğini kullanır
• $.grep() yardımcı sadece verilen dizideki her terim sağlanan işlevini çağırır. Bu durumda fonksiyonu regexp eğer dizideki vadeli yazıldı ne için bir eşleşme olup olmadığını görmek için kullanır.
• son olarak, responseFn() arama sonucu çağrılır.

çalışan demo: http://jsbin.com/ezifi

bu gibi görünüyor:

Sadece bir not: otomatik tamamlama belgelerine buluyorum bu noktada çok çocukça bir hareket. Bunu yapan örnek bulamadım, ve doktor olan çalışma bulamadım .css dosyaları gerekli ya da vardı .css sınıfları kullanılacaktır. Kodu inceleyerek tüm bu öğrendim.

Ayrıca, how can I custom-format the Autocomplete plug-in results? bkz