自动补全插件jquery.autocomplete.js的使用

华飞驰
2023-12-01

1.引入js文件和样式文件

<script src="<%=path%>/js/jquery/jquery.autocomplete.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="<%=path%>/js/jquery/jquery.autocomplete.css" />

2.使用示范

htm

<html:text property="reportArea" styleId="reportArea" styleClass="input_1" maxlength="100" style="width: 160px; font-size:16px;"></html:text>

js

$('#reportArea').autocomplete(data,{
			max: 0, //列表里的条目数
			minChars: 1, //自动完成激活之前填入的最小字符
			width: 160, //提示的宽度,溢出隐藏
			scrollHeight: 300, //提示的高度,溢出显示滚动条
			matchContains: true, //包含匹配,就是data参数里的数据,是否只要包含文本框里的数据就显示
			autoFill: false, //自动填充
			formatItem: function(row, i, max) {//对提示框内的内容格式化
				return row.name;
			},formatMatch: function(row, i, max) {//匹配的格式
				return row.name;
			},formatResult: function(row) {//最终显示在输入框中的内容
				return row.name;
			}
		}).result (function(event, data, formatted) {//result为选中提示框的内容后的处理函数
			console.debug(data);
			
		});


 类似资料: