有点发红
有点发红

jQuery UI Autocomplete 类似百度、谷歌输入框的自动填充文本域

jQuery UI 1.8版本新增了2个非常有用的控件：一个是Button，其作用是自定义页面按钮的样式；另一个就是Autocomplete，其作用是使文本框具有类似百度、谷歌输入框那种自动填充的能力。

 

Autocomplete的函数原型如下：

$(selector).autocomplete({
	source: [], // 自动填充的备选数据，注1
	position: {my: "left top", at: "left bottom"}, // 下拉列表相对于文本框的位置，注2
	minLength: 1, // 自动填充被激活前需要输入的最小字符数，默认为1
	delay: 300, // 停止输入到自动填充被激活的延迟时间，默认为300
	autoFocus: false, // 是否自动聚焦于下拉列表第一项，默认为false
	appendTo: "body", // 自动填充的下拉列表放到哪个元素内部，注3
	disabled: false, // 是否禁用自动填充，默认为false
	create: function(event, ui) {}, // 自动填充被创建时被触发
	search: function(event, ui) {}, // 在达到最小输入字符数并且延迟时间结束之后，自动填充数据请求开始之前被触发
	open: function(event, ui) {}, // 下拉列表打开时被触发
	focus: function(event, ui) {}, // 下拉列表项被聚焦时触发，ui.item对应被聚焦的列表项
	select: function(event, ui) {}, // 下拉列表项被选择时触发，ui.item对应被选择的列表项
	close: function(event, ui) {}, // 下拉列表隐藏时被触发
	change: function(event, ui) {} // 文本域的值发生改变时被触发，ui.item对应新的被选择的列表项
});

其中，Autocomplete作用的元素一般是或者