StackOverflow'un giriş etiketleri gibi jQuery otomatik tamamlama etiketleme eklentisi? [kapalı]

522

Hangi çözümler, SO'nun etiket girmek için kullandığı aynı otomatik tamamlamayı başarır?

Bir kelimeyi işleyebilen eklentiler var ama birden fazla kelimeyi işleyen herhangi bir şey görmedim.

jquery autocomplete tags

— Joe Phillips
kaynak

Araç rec olarak kapatmak için oylama.

— Ciro Santilli 法轮功冠状病六四事件法轮功

1

En iyisini oluşturdum - github.com/yairEO/tagify

— vsync

@vsync İlk cevaptaki listeye ekledi. Maalesef cevapta herhangi bir kod bulunmaması nedeniyle doğrudan codepen.io'ya bağlanamıyor

— Joe Phillips

@JoePhilllips - belki Google'ın kısaltılmış URL'lerini kabul eder

— vsync

@JoePhilllips - Eklentim listenin en iyisinden daha iyi ve üstte olmayı hak ediyor ve bunun için iyi satış noktalarına sahibim. şu anda listedeki en üstteki şişirilmiş (benimkinden x4), ekstra giriş öğesi (form serileştirmesi için kötü) kullanıyor ve bunlara virgül veya yapıştırma etiketleri desteklemiyor. güzel ama çoğu durumda gereksiz bazı özellikler sunuyor. autocompleteumutsuzca kullanılmalıdır IMHO

— vsync

763

Etkinlik sırasına, demolar / örnekler ve basitlik:

( demo ) https://github.com/yairEO/tagify
( demo ) https://github.com/aehlke/tag-it
( demo ) http://ioncache.github.com/Tag-Handler/
( demo ) http://textextjs.com/
( demo ) https://github.com/webworka/Tagedit
( demo ) https://github.com/documentcloud/visualsearch/
( demo ) http://harvesthq.github.io/chosen/ (bu gerçekten bir etiketleme eklentisi değil)
(demo?) http://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/
(demo?) http://jcesar.artelogico.com/jquery-tagselector/
(demo?) http://remysharp.com/wp-content/uploads/2007/12/tagging.php
(demo?) http://pietschsoft.com/post/2011/09/09/Tag-Editor-Field-using-jQuery-similar-to-StackOverflow.aspx

İlişkili:

/meta/100669/feedback-wanted-improved-tag-editor

— Dmitriy Nesteryuk
kaynak

IE9'da "Satır: 18 Hatası veriyor: Nesne 'tagit' özelliğini veya yöntemini desteklemiyor

— Raghav

2

Bu şaşırtıcı eklentinin en güncel sürümünü, dokümantasyonunu ve daha kapsamlı örneklerini arayan herkes buraya gitmeli ve uzaklaşmalıdır: github.com/aehlke/tag-it

— Crisman

1

Güncelleme: Sanırım magicsuggest şimdi en iyi seçenek.

— ssj

8

tag-it abartılıyor. Basit bir etiket sistemi için jquery istemek çok fazla, ancak jQuery UI ve jquery UI CSS gerektiren günümüzde sadece deli. Değmez.

— Alvaro

1

@scniro Projemde zaten kullanılan jQuery kullanmak umurumda değil çünkü jquery.tagsinput kullanarak sona erdi . Ben jquery UI ve CSS istemek deli olsa da.

— Alvaro

62

Bootstrap: Bootstrap kullanıyorsanız. Bu gerçekten iyi bir şey: Select2

Ayrıca TokenInput ilginç bir şey. Birincisi, jQuery-UI'ye bağlı değildir, ikincisi yapılandırması çok pürüzsüzdür.

Sahip olduğum tek sorun, yerel olarak ücretsiz etiketlemeyi desteklemiyor. Yani, sorgu-string yanıt JSON bir parçası olarak istemciye geri dönmek zorunda.

@Culithay'ın yorumda belirtildiği gibi TokenInput, özelleştirmek için birçok özelliği destekler. Ve diğerlerinin sahip olmadığı bazı özellikleri vurgulayın:

tokenLimit: Kullanıcı tarafından seçilmesine izin verilen maksimum sonuç sayısı. Sınırsız seçime izin vermek için null kullan
minChars: Bir arama yapılmadan önce kullanıcının girmesi gereken minimum karakter sayısı.
queryParam: Arama terimini sunucu tarafında içermesini beklediğiniz sorgu parametresinin adı

Girdi için teşekkürler culithay.

— Nishant
kaynak

3

TokenInput tam olarak aradığım şey gibi görünüyor: kullanıcı bazı şeyler yazıyor, sunucuda bir arama gerçekleştiriyor, kullanıcı aranan bir öğeyi seçebilir, durulayabilir ve tekrarlayabilir.

— Mala

1

TokenInput özelleştirmek için birçok özelliği destekler. Ve diğerlerinin sahip olmadığı bazı özellikleri vurguluyorum. - tokenLimit: Kullanıcı tarafından seçilmesine izin verilen maksimum sonuç sayısı. Sınırsız seçime izin vermek için null kullanın - minChars: Bir arama yapılmadan önce kullanıcının girmesi gereken minimum karakter sayısı. - queryParam: Sunucu tarafında arama terimini içermesini beklediğiniz sorgu parametresinin adı

— culithay

1

@culithay cevaba eklendi

— Nishant

— Onunla

İyi bir. Serbest etiketlemeyi desteklememek büyük bir sorun değildir, çünkü kolayca üstesinden gelinebilir.

— RationalRabbit

9

Bu başlangıçta jQuery'i indirmenin ve artık mevcut olmayan bir CDN aracılığıyla erişmenin bilgeliği hakkında ek bir soruyu yanıtladı.

Google ile ilgili soruyu yanıtlamak için. Sitelerimdeki ilgili CDN aracılığıyla JQuery ve bu tür kütüphanelerin çoğuna erişmeye geçtim.

Daha fazla insanın yaptığı gibi, kullanıcının makinelerinde önbelleğe alınmasının daha olası olduğu anlamına gelir, bu yüzden oyum iyi fikir için gidiyor.

Bunu ilk teklif ettiğimden bu yana geçen beş yıl içinde bu yaygın bir bilgelik haline geldi.

— Julian
kaynak

3

Bunu varsayılan şablonlarımızın bir parçası olarak da kullanıma sunuyoruz. Google bu kodu sıkıştırılmış ve bir CDN'den bizden daha hızlı sunabilir, ayrıca bir ziyaretçinin bunu önbelleğe alma şansı% 2 olsa bile hiç şansı yoktur.

— Tom

27

Bu asıl sorunun cevabı nasıl?

— Derek

3

Son bölüm 'Ayrıca, ...' Google sürümüne bağlanmanın iyi veya kötü bir fikir olup olmadığını soruyor ve cevabım bunun giderek daha iyi bir fikir olduğu.

— Julian

@Derek Başlangıçta sorduğumda başka kabul edilebilir cevaplarım olduğunu sanmıyorum. O zamandan beri değişti.

— Joe Phillips

5

Başka bir mükemmel eklenti: http://documentcloud.github.com/visualsearch/

— Mrchief
kaynak

3

Bu eklentiyi kontrol edin:

Etiketleri yüklemek için AJAX nasıl kullanılır https://stackoverflow.com/a/7662534/1078027

— boreq
kaynak

1

Bu jquery eklentisi Github'u sadece açık kaynaklı hale getirdik: tactivos / jquery-sew .

— user1880508
kaynak

1

Bu bağlantı soruyu cevaplayabilse de, cevabın temel kısımlarını buraya eklemek ve bağlantıyı referans olarak sağlamak daha iyidir. Bağlantı verilen sayfa değişirse, yalnızca bağlantı yanıtları geçersiz hale gelebilir (ve indirgenemez). Neden önemli olduğu için Nasıl Yanıtlanacağına bakın .

— bytebuster

3

Deneme sayfası öldü.

— Edward Olamisan