jQuery implementiert Twitters automatische Textvervollständigung effects_jquery

Der oben genannte Effekt kann mit dem jQuery-Plugin Typeahead.js erreicht werden. Dieses jQuery-Plugin stammt aus einem neuen Projekt von Twitter und unterstützt Remote- und lokale Datensätze. Noch einzigartiger ist, dass Sie den lokalen Speicher verwenden können, um den Datensatz lokal zu speichern, was die Benutzererfahrung effektiv verbessert. Es verfügt außerdem über viele Optionen für den Umgang mit Remote-Datensätzen, z. B. (Anfragehäufigkeit, maximale Anzahl gleichzeitiger Anfragen usw.).

Hauptfunktionen

Unterstützt lokale Datenspeicherung, Client-Laden und optimierte Ladegeschwindigkeit
Unterstützt mehrere Sprachen und unterstützt Arabisch
Unterstützen Sie die Integration der Hogan.js-Vorlagen-Engine
Unterstützt die Zusammenstellung mehrerer Datensätze
Unterstützt lokale und Remote-Datensätze

Projektadresse

http://twitter.github.io/typeahead.js

Anwendung

Führen Sie zunächst das jQuery-Framework und die zugehörigen JS- und CSS-Dateien des Typeahead.js-Plug-Ins im Kopf der Webseite ein

Code kopieren Der Code lautet wie folgt:

Dann fügen Sie das HTML-Element

hinzu, das Sie animieren möchten, z. B.

Code kopieren Der Code lautet wie folgt:

EndlichInitialisierung

Code kopieren Der Code lautet wie folgt:

Quelle ansehen

$( '#demo' ).typeahead({
Name: 'test' ,
lokal: [ "Site518" , "Lwolf" ],
Limit: 10
});