优秀的 jQuery 文本输入框自动完成 & 自动提示插件
文框输入框的自动完成和自动提示功能可以帮助用户快速的完成操作，是非常好的产品使用体验。这里向大家推荐一款优秀的 jQuery 文本输入框自动完成 & 自动提示插件，帮助你在网站中轻松添加输入框的自动完成和自动提示功能。
您可能感兴趣的相关文章
12款很棒的浏览器兼容性测试工具推荐 10套精美的免费网站后台管理系统模板 开发者必备的8个最佳云端集成开发环境 十款精心挑选的在线CSS3代码生成工具 推荐8款优秀的免费 Web 安全测试工具
在这篇文章中，我们使用 jQuery 实现智能输入框光标的位置。它不需要图像，是使用纯粹的 CSS3 实现的，而且实时、准确，这意味着你在添加或删除文本的时候它会自动适应。使用事件代理机制实现，所以不用担心性能问题。
下载源码 在线演示
主要参数介绍：
serviceUrl：Ajax 请求的 URL； lookup：本地数据数组； minChars：触发自动提示的最小字符数； params：请求的附加参数； formatResult：返回结果的格式化函数； autoSelectFirst：是否自动选中第一个； onSearchStart：搜索开始的回调函数； onSearchComplete：搜索完成的回调函数； tabDisabled：是否禁用 Tab 键；使用方法
这个差距的使用非常简单，下面是 HTML、CSS 和 JavaScript 示例代码。
HTML 代码：
< input type = "text" name = "country" id = "autocomplete" />
CSS 代码：
.autocomplete-suggestions { border : 1px solid #999 ; background : #FFF ; overflow : auto ; }
.autocomplete-suggestion { padding : 2px 5px ; white-space : nowrap ; overflow : hidden ; }
.autocomplete-selected { background : #F0F0F0 ; }
.autocomplete-suggestions strong { font-weight : normal ; color : #3399FF ; }
Ajax 查找模式：
$( '#autocomplete' ).autocomplete({
serviceUrl: '/autocomplete/countries' ,
onSelect: function (suggestion) {
alert( 'You selected: ' + suggestion.value + ', ' + suggestion.data);
}
});
本地查找模式：
var countries = [
{ value: 'Andorra' , data: 'AD' },
// ...
{ value: 'Zimbabwe' , data: 'ZZ' }
];
$( '#autocomplete' ).autocomplete({
lookup: countries,
onSelect: function (suggestion) {
alert( 'You selected: ' + suggestion.value + ', ' + suggestion.data);
}
});
您可能感兴趣的相关文章
60款非常酷的 jQuery 幻灯片演示和下载 15个款优秀的 jQuery 图片特效插件推荐 几款优秀的 jQuery Ajax 分页插件和教程 Web开发者必备的20款超赞 jQuery 插件 分享23款美轮美奂的 jQuery 图片特效插件
本文链接： 优秀 jQuery 文本输入框自动完成 & 自动提示插件
编译来源： 梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源
作者： Leo_wl
出处： http://HdhCmsTestcnblogs测试数据/Leo_wl/
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。
版权信息查看更多关于优秀的 jQuery 文本输入框自动完成 & 自动提示插件的详细内容...