jQuery는 Twitter의 자동 텍스트 완성을 구현합니다.

위의 효과는 jQuery 플러그인 Typeahead.js를 사용하여 얻을 수 있습니다. 이 jQuery 플러그인은 Twitter의 새 프로젝트에서 제공되며 원격 및 로컬 데이터 세트를 지원합니다. 독특한 기능은 로컬 스토리지를 사용하여 데이터 세트를 로컬에 저장할 수 있다는 점이며, 이는 사용자 경험을 효과적으로 향상시킵니다. 또한 요청 빈도, 최대 동시 요청 수 등 원격 데이터 세트를 처리하기 위한 다양한 옵션이 있습니다.

주요 기능

로컬 데이터 저장, 클라이언트 로딩, 최적화된 로딩 속도 지원
다국어 지원 및 아랍어 지원
Hogan.js 템플릿 엔진 통합 지원
여러 데이터 세트의 조합 지원
로컬 및 원격 데이터 세트 지원

프로젝트 주소

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

사용방법

먼저 웹 페이지 헤드에 jQuery 프레임워크와 Typeahead.js 플러그인의 관련 JS 및 CSS 파일을 소개합니다

코드 복사 코드는 다음과 같습니다.

그런 다음

애니메이션을 적용하려는 HTML 요소 를 추가합니다(예:

).

코드 복사 코드는 다음과 같습니다.

드디어
초기화

코드 복사

코드는 다음과 같습니다. 출처보기 $( '#demo' ).typeahead({

이름: '테스트' ,

지역: [ "Site518" , "Lwolf" ],
제한: 10
})