邮箱自动补全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. Oracle11完全卸载

    1.停用oracle服务:进入计算机管理,在服务中,找到oracle开头的所有服务,右击选择停止 2.在开始菜单中,找到Universal Installer,运行Oracle Universal I ...

  2. css实现三角形箭头

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Android 开发命令行完全攻略

    作为命令行的爱好者,我想写这个主题已经有好一段时间了.除了显得很酷之外,命令行的使用能够提高我们的开发效率,因为相比通过鼠标点击一系列的菜单选项,使用键盘输入几个字符并点击 TAB 健显然会快很多. ...

  4. [转]MySQL innodb buffer pool

    最近在对公司的 MySQL 服务器做性能优化, 一直对 innodb 的内存使用方式不是很清楚, 乘这机会做点总结. 在配置 MySQL 的时候, 一般都会需要设置 innodb_buffer_poo ...

  5. Android 子线程测试

    private volatile boolean mStopped = false; private int i; TextView tv1; TextView tv2; @Override prot ...

  6. mysql 主命令总结

    mysql 登录和恢复命令 mysqladmin 管理 mysql 命令 mysqldump 备份命令 mysqlbinlog 解析 binlog 命令 source 恢复数据命令

  7. <Interview Problem>二叉树根到叶节点求和值匹配

    题目大意:一颗二叉树,每个节点都有一个Value, 判断根节点到叶节点的路径求和值是否等于某个数Sum. 比如说如下这样一颗二叉树,76是45,21,10这条路径的求和值,77就没有满足条件的路径. ...

  8. C# : CEF操作

    代码挺差的,仅供学习.参考 class CEFGlueLoader { class CefAppImpl : CefApp { protected override void OnBeforeComm ...

  9. 常用SQL总结

    数据库知识总结一.数据库服务器设置1,查看数据库服务器编码    show variables like 'character%';2,设置数据库服务器编码    set character_set_ ...

  10. Android AsyncTask分析

    ---恢复内容开始--- 因为android的UI线程是不安全的,如果你UI线程里执行一些耗时任务,很容易就导致程序崩溃.并且目前网络任务也不能够在UI线程里执行.处理这些问题除了直接写一个线程以外, ...