jQuery实现用户输入自动完成功能
利用jQuery UI中Auto-complete插件实现输入自动完成功能，大家在使用诸如淘宝、京东等电商平台搜索商品时，往往只要输入商品的一些特殊字符，就可以显示出和该字符相近的列表菜单，用户使用鼠标或者键盘方向键就可以快速选择，实现了很好的用户体验。
创新互联是一家专业的成都网站建设公司，我们专注成都网站设计、成都网站制作、网络营销、企业网站建设，买友情链接，广告投放为企业客户提供一站式建站解决方案，能带给客户新的互联网理念。从网站结构的规划UI设计到用户体验提高，创新互联力求做到尽善尽美。
1.最简单的用户输入自动完成
jQuery UI Autocomplete - Default functionality
2 使用远程数据源自动完成
Auto-complete插件不光可以实现本地数据源的自动完成，也可以读取远程的数据源，列如实现从服务器端读取数据源信息。
通过将服务器数据缓存到浏览器中，获取的数据源首先保存在cache变量中。
$(function() {
//自定义缓存变量
var cache = {};
//自动完成插件函数
$("#tags").autocomplete({
//定义用户最少输入的字符数
minLenght: 2,
source: function(request, response){//定义远程获取数据源函数
var term = request.term;//定义用户请求信息变量
if(term in cache) {//判断请求数据是否存在缓存中
response(cache[term]);//真，从缓存中读取数据
return;
}
$.getJSON('data.json', request, function(data, Status, xhr) {
cache[term] = data.result;//缓存远程数据
response(data.result);
});
}
});
});以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持创新互联！
网站标题：jQuery实现用户输入自动完成功能
当前路径：http://6mz.cn/article/jjhgio.html