jQuery UI 텍스트필드 자동완성 autocomplete

1 개요[ | ]

jQuery UI 텍스트필드 자동완성 autocomplete
  • 입력된 값들의 리스트를 사전에 보여주어 사용자가 좀 더 빨리 원하는 값을 찾을 수 있도록 함

2 속성[ | ]

옵션 appendTo, autoFocus, delay, disabled, minLength, position, source
메소드 close, destroy, disable, enable, instance, option, search, widget
이벤트 change, close, create, focus, open, response, search, select

3 예시[ | ]

html
Copy
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<script>
$(function() {
	var languages = [
		"ActionScript", "AppleScript", "Asp","BASIC", "C",
		"C++", "Clojure", "COBOL", "ColdFusion", "Erlang",
		"Fortran", "Groovy", "Haskell", "Java", "JavaScript",
		"Lisp", "Perl", "PHP", "Python", "Ruby",
		"Scala", "Scheme"
	];

	$( "#my-language" ).autocomplete({
		source: languages
	});
});
</script>

프로그래밍 언어: <input id='my-language' type='text'>
→ b를 입력하면 b가 포함된 모든 항목들(BASIC, COBOL, Ruby)이 출력됨
→ ja를 입력하면 ja가 포함된 모든 항목들(Java, JavaScript)이 출력됨

4 같이 보기[ | ]

5 참고 자료[ | ]

편집자 121.174.205.144 J Jmnote 121.170.144.114 218.146.70.37 Jmnote bot