jQuery 자동 완성
jQuery Autocomplete
jQuery Autocomplete 플러그인은 사용자 입력 값을 기반으로 검색 및 필터링하므로 사용자는 미리 설정된 값 목록에서 빠르게 찾고 선택할 수 있습니다. 자동 완성 필드에 초점을 맞추거나 문자를 입력하면 플러그인이 일치하는 항목 검색을 시작하고 선택할 값 목록을 표시합니다. 더 많은 문자를 입력하면 사용자는 더 나은 일치 항목을 찾기 위해 목록을 필터링할 수 있습니다.
이 플러그인은 이제 jQuery UI의 일부이며 독립 버전은 업데이트되지 않습니다. 현재 버전은 1.6입니다.
jQuery Autocomplete 공식 웹사이트를 방문하여 jQuery Autocomplete 플러그인을 다운로드하세요.
자동완성에 대한 자세한 내용은 API 문서 Autocomplete Widget을 참조하세요.
예제 데모
jQuery Autocomplete 플러그인 데모입니다.
Instance
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</body>
</html>인스턴스 실행 »
온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요
