jQuery UI:邮箱自动补全函数
$('#email').autocomplete({
delay:0,
autoFocus:true,
source:function(request,response){
var hosts = ['qq.com','163.com','263.com','gmail.com','sina.com.cn'],
term = request.term,//获取用户输入内容
name = term,//邮箱的用户名
host = '',//邮箱的域名
ix = term.indexOf('@'),//@的位置
result = [];//最终呈现的邮箱列表
result.push(term);
//当有@事重新分配用户名和域名
if(ix > -1){
name = term.slice(0,ix);
host = term.slice(ix + 1);
}
if(name){
// var findedHosts = (host ? findedHosts = $.grep(hosts,function(value,index){
// return value.indexOf(host) > -1;
// }) : hosts),
// findedResult = $.map(findedHosts, function(value,index) {
// return name + '@' + value;
// });
//如果用户已经输入@和后面的域名
//那么就找到相关的域名提示,比如sfsdf@.1就提示sfsdf@.163.com
//如果没输入都提示
var findedHosts = [];
if(host){
findedHosts = $.grep(hosts,function(value,index){
return value.indexOf(host) > -1;
});
}else{
findedHosts = hosts;
}
var findedResult = $.map(findedHosts, function(value,index) {
return name + '@' + value;
});
result = result.concat(findedResult);
}
response(result);
},
});
另:$.grep()工具函数回调事,是true,返回的是value
$(function(){
var arr = ['1234','jd','dang','12d3'];
var a = $.grep(arr,function(value,index){
return value.indexOf('d') > -1;
});
alert(a);
// alert(a[1]);
// var str = 'dangxingming';
// alert(str.indexOf('k'));
});
jQuery UI:邮箱自动补全函数的更多相关文章
- 【jquery】邮箱自动补全 + 上下翻动
最近在做通行证项目,里面注册模块有邮箱注册,需求方想要在输入 @ 后触发下拉框显示各个邮箱,效果如下: html 代码: <!DOCTYPE HTML> <html lang=&qu ...
- jquery+css实现邮箱自动补全
今天在公司做一个电子商务网站的注册会员时,要求用户在电子邮箱文本框中输入时,给与热点提示常用的电子邮箱,帮助用户选择,提高体验效果.下面是用Jquery+css实现的邮箱自动补全,供大家参考和学习. ...
- js邮箱自动补全
邮箱自动补全js和jQuery html: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...
- jquery的输入框自动补全功能+ajax
jquery的输入框自动补全功能+ajax 2017年05月10日 18:51:39 辣姐什么鬼 阅读数:1461 标签: web前端 更多 个人分类: web前端 内容参考网友文章写成,原博的链 ...
- jquery input 搜索自动补全、typeahead.js
最近做个一个功能需要用到自动补全,然后在网上找了很久,踩了各种的坑 最后用typeahead.js这个插件,经过自己的测试完美实现 使用方法:在页面中引入jquery.jquery.typeahead ...
- jQuery搜索框自动补全功能插件实现-autocomplete.js
最近用nodeclub实现股票的输入关键字自动补全股票信息进行搜索功能,原先用jQuery-ui,结果jQuery-ui库太大,所以考虑用其他插件,最终选择使用autocomplete.js,控件简单 ...
- jQuery邮箱自动补全代码
JScript 代码 复制 (function($){ $.fn.emailMatch= function(settings){ var defaultSettings = { emailTip: ...
- 知问前端——自动补全UI
自动补全(autocomplete),是一个可以减少用户输入完整信息的UI工具.一般在输入邮箱.搜索关键字等,然后提取出相应完整字符串供用户选择. 调用autocomplete()方法 var hos ...
- 第一百八十一节,jQuery-UI,知问前端--自动补全 UI--邮箱自动补全
jQuery-UI,知问前端--自动补全 UI--邮箱自动补全 学习要点: 1.调用 autocomplete()方法 2.修改 autocomplete()样式 3.autocomplete()方法 ...
随机推荐
- Qt编译OpenGL程序遇到的问题
软件版本号: Qt 4.8.5 依照网上的例程(http://www.qiliang.net/old/nehe_qt/lesson01.html),跑了一下基于Qt Creator的OpenGL.因为 ...
- type 'simple Class' does not conform to protocol 'Example Protocol'错误
在看swift教程中"接口和扩展"这小部分. 在编写时提示"type 'simple Class' does not conform to protocol 'Examp ...
- vue11 vue实例方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Introduction to IIS Architectures
https://docs.microsoft.com/en-us/iis/get-started/introduction-to-iis/introduction-to-iis-architectur ...
- Spring Security Java Config Preview--官方
原文地址:[1]https://spring.io/blog/2013/07/02/spring-security-java-config-preview-introduction/ [2]https ...
- 突破极限 解决大硬盘上安装Sco Unix新思路
突破极限 解决大硬盘上安装Sco Unix新思路 [url]http://os.51cto.com/art/200809/89750.htm[/url] 硬盘越做越大,然我喜欢让我忧.10 ...
- ES6特性-对比两个值是否相等
因为JavaScript中有语言缺陷,所以出了个Object.is()
- PHP获取一周后的时间戳
echo strtotime("now");//相当于将英文单词now直接等于现在的日期和时间,并把这个日期时间转化为unix时间戳.这个效果跟echo time();一样. ec ...
- SpringBoot 增加 拦截器 判断是否登录
1.创建拦截器 package com.example.demo.interceptor; import org.slf4j.Logger; import org.slf4j.LoggerFactor ...
- 讲的好,php后端模式,php-fpm以及php-cgi, fast-cgi,以及与nginx的关系
关于cgi是什么,fast-cgi是什么,php-cgi是什么,fast-cgi是什么,下面这篇讲的很清楚: https://segmentfault.com/q/1010000000256516 另 ...