优秀的 jQuery 文本输入框自动完成 & 自动提示插件

昵称10504424 2013-03-06

展开全文

文框输入框的自动完成和自动提示功能可以帮助用户快速的完成操作，是非常好的产品使用体验。这里向大家推荐一款优秀的 jQuery 文本输入框自动完成 & 自动提示插件，帮助你在网站中轻松添加输入框的自动完成和自动提示功能。

您可能感兴趣的相关文章

　　在这篇文章中，我们使用 jQuery 实现智能输入框光标的位置。它不需要图像，是使用纯粹的 CSS3 实现的，而且实时、准确，这意味着你在添加或删除文本的时候它会自动适应。使用事件代理机制实现，所以不用担心性能问题。

下载源码在线演示

　　主要参数介绍：

使用方法

　　这个差距的使用非常简单，下面是 HTML、CSS 和 JavaScript 示例代码。

　　HTML 代码：

1	`<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); 
    } 
});