这篇文章主要介绍了JS实现的一个简单的Autocomplete自动完成例子,需要的朋友可以参考下

分享一篇无意间发现的自动完成源码。这里测试的时候使用的是数组，实际使用的时候，我们换成Ajax从服务器端获取的方式就OK了。

提示：可以直接保存到一个html文件中查看效果。

复制代码 代码如下:

body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}
.auto_hidden {
    width:204px;border-top: 1px solid #333;
    border-bottom: 1px solid #333;
    border-left: 1px solid #333;
    border-right: 1px solid #333;
    position:absolute;
    display:none;
}
.auto_show {
    width:204px;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
    border-left: 1px solid #333;
    border-right: 1px solid #333;
    position:absolute;
    z-index:9999; /* 设置对象的层叠顺序 */
    display:block;
}
.auto_onmouseover{
    color:#ffffff;
    background-color:highlight;
    width:100%;
}
.auto_onmouseout{
    color:#000000;
    width:100%;
    background-color:#ffffff;
}

自动完成函数(Autocomplete Function)

   
   

您可能感兴趣的文章:

• Autocomplete Textbox Example javascript实现自动完成成功
• JS 自动完成 AutoComplete(Ajax 查询)
• jquery自动完成插件(autocomplete)应用之PHP版
• Jquery AutoComplete自动完成 的使用方法实例
• jQuery.Autocomplete实现自动完成功能（详解）
• jQuery Autocomplete自动完成插件
• jquery autocomplete自动完成插件的的使用方法
• jQuery UI AutoComplete 自动完成使用小记
• jQuery 插件autocomplete自动完成应用(自动补全)(asp.net后台)
• 基于bootstrap插件实现autocomplete自动完成表单

以上就是JS实现的一个简单的Autocomplete自动完成例子的详细内容，更多请关注本站其它相关文章！