js实现匹配时换色的输入提示特效代码

本文实例讲述了js实现匹配时换色的输入提示特效代码。分享给大家供大家参考。具体如下：

这是一款js输入提示特效，当你在输入框中输入字母时，如果下边列出的类别中有与你字母相匹配的，那么这些内容将会变成红色，着重显示出来，与输入框下拉提示是基本是一样的，只是换了一个方式。

运行效果截图如下：

在线演示地址如下：

http://demo.jb51.net/js/2015/js-tips-cha-color-codes/

具体代码如下：

html, body { margin:20px; padding:0; }
body { color:#454444; padding: 0; font:12px/30px "宋体"; font-family:Tahoma;}
a { color:#454444; text-decoration:none; }
a:visited { color:#454444; }
a:hover, a:active, a:focus { color:#ff6842; text-decoration:underline; }
.fenlei {margin-bottom:30px; width:100%; float:left;}
.fenlei li { float:left; width:20%;}
.fenlei span,.fenlei span a,.fenlei span a:link,.fenlei span a:active,.fenlei span a:visited { color:#f35d61;}
.red{color:red;}






 

 
Adidas阿迪达斯
 
AFU阿芙
 
Anna Sui安娜苏
 
AFU阿芙
 
Anna Sui安娜苏
 


 

 
barbie芭比
 
Balo贝罗
 
barbie芭比
 
barbie芭比
 
Balo贝罗
 

希望本文所述对大家的javascript程序设计有所帮助。