邮箱自动补全js和jQuery

html:   

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery实现输入框自动补全邮箱提示 - 素材家园</title>
<link href="css/sucaijiayuan.css" type="text/css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script src="js/emailAutoComplete.js"></script>
</head>
<body>
<center>
<h1>输入邮箱试试!</h1>
<br />
<div class="parentCls"><input type="text" class="inputElem"></div>
</center>
</body>
</html>

js: email.js

    

@charset "utf-8";
* { outline:none;
margin:0;
padding:0;
font-family:microsoft yahei;
}
ul, li {
list-style:none;
}
.inputElem {
width:220px;
height:26px;
line-height:26px;
padding: 0px 4px;
color: #666666;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
border: 1px solid;
border-color: #b8b8b8 #dcdcdc #dcdcdc #b8b8b8;

}
.parentCls {
margin-bottom: 10px;
border: 2px solid #f2f2f2;
}
.auto-tip li {
width:100%;
text-align:left;
height:22px;
line-height:22px;
font-size:14px;
}

.auto-tip li.hoverBg {
background:#ddd;
cursor:pointer;
}
.auto-tip li em{font-style:normal;}
.red {
color:#333;
}
.hidden {
display:none;
}

外加一个jQuery.min.js

js邮箱自动补全的更多相关文章

  1. 【jquery】邮箱自动补全 + 上下翻动

    最近在做通行证项目,里面注册模块有邮箱注册,需求方想要在输入 @ 后触发下拉框显示各个邮箱,效果如下: html 代码: <!DOCTYPE HTML> <html lang=&qu ...

  2. jquery+css实现邮箱自动补全

    今天在公司做一个电子商务网站的注册会员时,要求用户在电子邮箱文本框中输入时,给与热点提示常用的电子邮箱,帮助用户选择,提高体验效果.下面是用Jquery+css实现的邮箱自动补全,供大家参考和学习. ...

  3. jQuery邮箱自动补全代码

    JScript 代码   复制 (function($){ $.fn.emailMatch= function(settings){ var defaultSettings = { emailTip: ...

  4. jQuery UI:邮箱自动补全函数

    $('#email').autocomplete({ delay:0, autoFocus:true, source:function(request,response){ var hosts = [ ...

  5. 【VS Code】中node.js代码自动补全的方法

    原文链接: https://blog.csdn.net/qq_39189819/article/details/91347484

  6. 知问前端——自动补全UI

    自动补全(autocomplete),是一个可以减少用户输入完整信息的UI工具.一般在输入邮箱.搜索关键字等,然后提取出相应完整字符串供用户选择. 调用autocomplete()方法 var hos ...

  7. 第一百八十一节,jQuery-UI,知问前端--自动补全 UI--邮箱自动补全

    jQuery-UI,知问前端--自动补全 UI--邮箱自动补全 学习要点: 1.调用 autocomplete()方法 2.修改 autocomplete()样式 3.autocomplete()方法 ...

  8. jQuery 邮箱下拉列表自动补全

    综述 我想大家一定见到过,在某个网站填写邮箱的时候,还没有填写完,就会出现一系列下拉列表,帮你自动补全邮箱的功能.现在我们就用jQuery来实现一下. 博主原创代码,如有代码写的不完善的地方还望大家多 ...

  9. jquery实现自动补全邮箱地址

    开始做的邮箱补全代码 //检查email邮箱 function isEmail(str) { if (str.indexOf("@") > 0) { return true; ...

随机推荐

  1. java布局学习 (二)

    前文中介绍了FlowLayout和BorderLayout 本文我们将会继续介绍java中的布局方式 (3)GridLayout 网格布局 这种布局会将整个容器划分成M行*N列的网格. 如下图:    ...

  2. 使用geoserver发布arcgis切片

    arcgis map 版本:10.1,10.2,10.3均可 jre:7或者8 geoserver:2.8.2以上 切片:松散型,256*256  ,png 1:安装geoserver并独立部署geo ...

  3. XEN的启动信息输出到“Platform timer is 14.318MHz HPET”就暂停接收的解决办法

    使用Serial Over Lan(SOL)来双机调试 XEN,在 XEN 启动时,引导信息输出到以下这一句时,就不再发送调试信息了: ...(XEN) Intel machine check rep ...

  4. Ado.net 数据库读取文件

    string connStr = ConfigurationManager.ConnectionStrings["connStr"].ConnectionString; using ...

  5. Objective-C基础2

    16.继承 1)不能和父类定义一样的变量 2)单一继承,不支持继承多个类 3)支持多层继承子类也可以被继承 17.实例变量修饰符 public:公开的,在其他类中也可以访问 protected:受保护 ...

  6. MooseFS

    http://www.moosefs.org/

  7. Oracle序列(Sequence)创建、使用、修改、删除

    Oracle对象课程:序列(Sequence)创建.使用.修改.删除,序列(Sequence)是用来生成连续的整数数据的对象.序列常常用来作为主键中增长列,序列中的可以升序生成,也可以降序生成.创建序 ...

  8. Python导入Scipy子模块时出错

    导入Scipy子模块时报错,出现的问题都是提示 61 from numpy._distributor_init import NUMPY_MKL  # requires numpy+mklNo mod ...

  9. [转]opencv3.0 鱼眼相机标定

    [原文转自]:http://blog.csdn.net/qq_15947787/article/details/51441031 前两天发表的时候没注意,代码出了点错误,所以修改了一下,重新发上来.  ...

  10. Curling 2.0

    Description On Planet MM-21, after their Olympic games this year, curling is getting popular. But th ...