首页 > 代码库 > javascript 邮箱输入自动补全插件（转）
javascript 邮箱输入自动补全插件（转）
<!DOCTYPE HTML><html> <head> <meta charset="utf-8"> <title>inputSuggest_0.1.js</title> <style type="text/css"> body{margin:0;padding:0;} input{width:200px;} .suggest-container{border:1px solid #C1C1C1;visibility:hidden;} .suggest-item{padding:3px 2px;} .suggest-active {background:#33CCFF;color:white;padding:3px 2px;} </style> <script type="text/javascript" > /** * JavaScript inputSuggest v0.1 * Copyright (c) 2010 snandy * Blog: http://snandy.javaeye.com/ * QQ群: 34580561 * Date: 2010-09-25 * Download by http://www.codefans.net * * new InputSuggest({ * input HTMLInputElement 必选 * data Array [‘sina.cn‘,‘sina.com‘,‘2008.sina.com‘,‘vip.sina.com.cn‘] 必选 * containerCls 容器className * itemCls 容器子项className * activeCls 高亮子项className * width 宽度设置 此项将覆盖containerCls的width * opacity 透明度设置 此项将覆盖containerCls的opacity * }); */function InputSuggest(opt){ this.win = null; this.doc = null; this.container = null; this.items = null; this.input = opt.input || null; this.containerCls = opt.containerCls || ‘suggest-container‘; this.itemCls = opt.itemCls || ‘suggest-item‘; this.activeCls = opt.activeCls || ‘suggest-active‘; this.width = opt.width; this.opacity = opt.opacity; this.data = http://www.mamicode.com/opt.data || [];"curr_val"); } } return; case 40: // 方向键下 if(this.active==null){ this.active = container.firstChild; this.attr(this.active, ‘class‘, aCls); input.value = http://www.mamicode.com/this.active.firstChild.data;"curr_val"); } } return; } } if(e.keyCode==27){ // ESC键 this.hide(); input.value = http://www.mamicode.com/this.attr(input,‘curr_val‘);"text/javascript"> window.onload = function(){ var sinaSuggest = new InputSuggest({ input: document.getElementById(‘sina‘), data: [‘sina.cn‘,‘sina.com‘,‘vip.sina.com.cn‘,‘2008.sina.com‘,‘263.sina.com‘] }); var sohuSuggest = new InputSuggest({ width: 300, opacity: 0.3, input: document.getElementById(‘sohu‘), data: [‘sohu.com‘,‘sogou.com‘,‘chinaren.com‘,‘vip.sohu.com‘,‘sohu.net‘,‘2008.sohu.com‘,‘sms.sohu.com‘] }); } </script> </head> <body> <div style="width:400px;margin:30px auto;text-align:center;"> <label>新浪</label> <input type="text" id="sina"/> <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> <label>搜狐</label> <input type="text" id="sohu"/> </div> </body></html>
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。