jQuery实现下拉邮箱地址自动填充补全功能
2015-01-12 13:28:45  By: shinyuu

• shinyuu
• JQuery教程
• 5
• 5341
• 1

刚刚过完一个周末、2015年第一个双休、当然对于一个程序员来说休息也是闲不下来的、就在看博客、完善个人觉得不完美的地方、随便看看那里有可以改进的地方、完善了一部分功能之后、想给输入邮件的时候添加自动填充邮件地址、就像新浪那样、当然现在我的博客所有邮件输入的地方都加上了邮件填充、不愿意独享、特将这个插件分享一下、希望对一些哥们有用、看看效果吧、你要以在下方回复框里面输入试试、再上一张效果图片

效果还可以吧、大家也可以在下面回复的地方输入试试

所有JS代码都是封装到一个js文件里面的、使用方法如下

JS代码

<script type="text/javascript" src="jQuery.autoMail.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$(´#email´).autoMail();
});
</script>

CSS代码

.mailBox{
	background:#fff;
	border:1px solid #ddd;
	padding:3px 5px 5px;
	position:absolute;
	z-index:9999;
	display:none;
	-webkit-box-shadow:0px 2px 7px rgba(0, 0, 0, 0.35);
	-moz-box-shadow:0px 2px 7px rgba(0, 0, 0, 0.35);
}
.mailBox p{
	width:100%;
	margin:0;
	padding:0;
	height:20px;
	line-height:20px;
	clear:both;
	font-size:12px;
	color:#ccc;
	cursor:default;
}
.mailBox ul{
	padding:0;
	margin:0;
}
.mailBox li{
	font-size:12px;
	height:22px;
	line-height:22px;
	color:#939393;
	font-family:´Tahoma´;
	list-style:none;
	cursor:pointer;
	overflow:hidden;
}
.mailBox .cmail{
	color:#000;
	background:#e8f4fc;
}

最后给源代码贴出来、希望对大家有用、源代码下载就可以运行看效果的哈

源代码下载链接: http://dwtedx.com/download.html?bdkey=s/1jGh4Fcy 密码: wow2

若资源对你有帮助、浏览后有很大收获、不妨小额打赏我一下、你的鼓励是维持我不断写博客最大动力

想获取DD博客最新代码、你可以扫描下方的二维码、关注DD博客微信公众号（ddblogs）

或者你也可以关注我的新浪微博、了解DD博客的最新动态：DD博客官方微博（dwtedx的微博）

如对资源有任何疑问或觉得仍然有很大的改善空间、可以对该博文进行评论、希望不吝赐教

为保证及时回复、可以使用博客留言板给我留言: DD博客留言板（dwtedx的留言板）

感谢你的访问、祝你生活愉快、工作顺心、欢迎常来逛逛