html 判断输入的是手机号码,用js验证手机号码格式是否正确
记录一下在之前工作中遇到的手机号码验证的一个问题,主要是用正则表达式来判断手机号是否输入正确。下面附上代码,已经实现过的。
用户注册
var Val={
//正则表达式验证是否为手机号码
isMobile:function(s){return this.test(s,/^1[34578]\d{9}$/)},
isNumber:function(s,d){return !isNaN(s.nodeType==1?s.value:s)&&(!d||!this.test(s,"^-?[0-9]*\\.[0-9]*$"))},
isEmpty:function(s){return !jQuery.isEmptyObject(s)},test:function(s,p){s=s.nodeType==1?s.value:s;return new RegExp(p).test(s)}
};
$(".users").blur(function(){
var v=$(this).val();
var n=$(this).next();
if(!isEmpty(v) && !Val.isMobile(v)){
$(".cellphone_error").html("请输入正确的手机号码!");
$('.account').css('border','1px solid #ff0000');
return;
}if(isEmpty(v)){
$(".cellphone_error").html("请输入账号!");
$('.account').css('border','1px solid #ff0000');
return;
}
css样式
@charset "UTF-8";
/**
*
* @authors Your Name (you@example.org)
* @date 2016-11-08 17:38:55
* @version $Id$
*/
html,body {
font-family: Helvetica, "microsoft yahei";
margin: 0px;
padding: 0px;
}
input,textarea {
-webkit-user-modify: read-write-plaintext-only;
-webkit-appearance: none;
outline: none;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
ul {
list-style: none;
margin: 0px;
padding: 0px;
}
a{
text-decoration: none;
}
.clear{
clear: both;
}
.hidden {
visibility: hidden;
}
::-webkit-input-placeholder {
/* WebKit browsers */
color: #c0c0c0;
}
:-moz-placeholder {
/* Mozilla Firefox 4 to 18 */
color: #c0c0c0;
}
::-moz-placeholder {
/* Mozilla Firefox 19+ */
color: #c0c0c0;
}
:-ms-input-placeholder {
/* Internet Explorer 10+ */
color: #c0c0c0;
}
/**头部样式**/
.header{
width: 100%;
background: #2cc2ff;
height:94px;
}
.mainheader {
width: 664px;
margin: 0 auto;
height: 36px;
padding: 29px 28px 29px 28px;
}
.closeicon{
float: left;
width: 36px;
height:36px;
}
.closeicon img {
width: 36px;
height: 36px;
}
.mainheader .title{
font-size: 34px;
color: #ffffff;
height: 36px;
line-height: 36px;
width: 664px;
text-align: center;
letter-spacing: 4px;
float: left;
}
.login{
width: 720px;
margin: 0 auto;
padding-top: 50px;
}
.mainlogin{
width: 80%;
margin: 0 10%;
}
.account,.password{
width: 100%;
height:94px;
border-radius: 8px;
border: 1px solid #a6dfff;
line-height: 100px;
}
.account input, .password input {
font-size: 28px;
font-family: Helvetica, "microsoft yahei";
outline: none;
border: 0px;
width: 75%;
margin-left: 3.3%;
}
.cellphone_error, .getcode_error{
color: #f60000;
font-size: 20px;
height: 56px;
line-height: 56px;
}
.loginbtn{
width: 100%;
height:94px;
font-size: 28px;
font-family: Helvetica, "microsoft yahei";
color: #fff;
outline: none;
border: 1px solid #2cc2ff;
border-radius:96px;
letter-spacing: 2px;
background: #2cc2ff;
line-height: 100px;
}
.forgetpsd {
font-size: 28px;
height: 28px;
line-height: 28px;
color: #ffae00;
float: right;
margin-bottom: 25px;
}
.quklog_register {
margin-top: 40px;
/*margin-bottom: 198px;*/
font-size: 28px;
color: #8e8e8e;
}
.quklog_register a {
color: #2cc6ff;
font-size: 28px;
text-decoration: none;
}
.goregister {
float: right;
}
.loadingDiv{
position:absolute;
background:#000;
background-size: 100% 100%;
opacity:0.5;
filter:alpha(opacity=50);
top:0;
right: 0;
left:0;
bottom: 0;
margin:auto;
z-index:10000;
}
.loadingImg{
position:absolute;
width:57px;
height: 57px;
top:420px;
right: 0;
left:0;
bottom: 0;
margin:0 auto;
z-index:10000;
cursor: wait;
background:url(../images/loading2.gif) no-repeat scroll 5px 10px;
}
.otherway {
width: 588px;
height: 20px;
position: relative;
margin:0 auto;
margin:0 auto;
}
.line {
width: 588px;
height: 1px;
background: #D9EBFF;
}
.methods {
position: absolute;
top: -50%;
left: 30.1%;
color: #c0c0c0;
background: #ffffff;
font-size: 20px;
height: 20px;
line-height: 20px;
width: 232px;
text-align: center;
}
.mode {
width: 384px;
height: 48px;
margin: 0 auto;
margin-bottom: 172px;
margin-top:38px;
}
.account_error,
.password_error {
color: #f60000;
font-size: 20px;
margin-left: 66px;
height: 56px;
line-height: 56px;
}
html 判断输入的是手机号码,用js验证手机号码格式是否正确相关推荐
- JS验证邮箱格式是否正确的代码
验证邮箱格式是否正确的方法有很多,接下来为大家介绍下使用js是如何做到的 复制代码代码如下: /* *验证邮箱格式是否正确 *参数strEmail,需要验证的邮箱 */ www.jbxue.co ...
- JS验证手机号码格式
原文地址为: JS验证手机号码格式 其实对于验证手机号码,网上的例子很多,可是由于153(联通).159(移动)等新区段的开通,使很多的验证修改起来比较麻烦.所以今天呈上一个容易修改的JavaScri ...
- 最新js验证手机号码、电话号码、身份证号码正则表达式代码
js验证手机号码.电话号码.身份证号码正则表达式 手机号码正则表达式验证 固定电话号码正则表达式 身份证正则 手机号码正则表达式验证 function checkPhone(){ var phone ...
- angularjs 验证身份证格式 和 一般JS验证身份证格式
1:angularjs 验证身份证格式 1.1 定义身份证验证指令: .directive('cardCheck',['$http','$rootScope',function($http,$root ...
- php用js验证格式,怎样用JS验证E-mail格式
这次给大家带来怎样用JS验证E-mail格式,用JS验证E-mail格式的注意事项有哪些,下面就是实战案例,一起来看一下. 最近做了一个前端的项目,要求:输入的数据必须包含 @ 符号和点号(.).同时 ...
- js验证身份证号码是否正确(整理)
使用:/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/ if(!(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(v ...
- js 验证图片格式和像素大小
js 验证图片格式和像素大小 实现思路: 方法:validateImageSize中, 对象:FileReader,加载图片为异步加载: 所以,当提交form再校验图片格式.像素会导致结果错误, 故: ...
- 要求用户输入一个电子邮件。验证电子邮件格式是否正确。 电子邮件格式:XX@XX.com 实现方式:该字符串中必须包含@字符串和.字符串。 @不能出现在第一个位置,并且@位置大于.;
要求用户输入一个电子邮件.验证电子邮件格式是否正确. 电子邮件格式:XX@XX.com 实现方式:该字符串中必须包含"@"字符串和"."字符串. "@ ...
- 用户输入邮箱,验证邮箱格式是否正确(验证用户输入的邮箱地址中是否含有字符'@')
要求:用户输入邮箱,验证邮箱格式是否正确(验证用户输入的邮箱地址中是否含有字符'@'). 目的:掌握邮箱验证控件的原理和方法. #include<stdio.h> #include< ...
- jQuery Validate.js验证手机号码。
html: <div class="edit_phone1 tis_edit"> <form id="cell" class="fo ...
最新文章
- eclipse 无法使用注解的两个解决方法
- 10树莓派Samba的安装与配置
- android jni通过cmake使用第三方静态库和动态库
- [AtCoder Beginner Contest 215] A-G题解
- js 中转换成list集合_程序员:java集合介绍-List,具说很详细,你不来看看?
- [蓝桥杯]ALGO-188.算法训练_P0504
- Java-Eclipse快捷键汇总
- Lightroom Classic 教程,如何将照片从 Lightroom 移至Ps,在 Ps 中为照片添加文本?
- 冷备份实验,裸设备上备份
- ubuntu终端命令停止_解决Linux关闭终端(关闭SSH等)后运行的程序或者服务自动停止【后台运行程序】...
- 日本现代数学发展历程及其启示
- sigmoid函数推导过程
- m序列的原理以及verilog实现
- [知乎]这可能是最全面的龙芯3A3000处理器评测
- [C/C++]宽字符与控制台输出
- 局域网文件共享的几种方法
- 0716 process finished with exit code 0 解决
- pygame-KidsCanCode系列jumpy-part8-记录历史最高分
- Python循环 - 胖子老板来包烟
- 数据库无法打开的原因及解决办法
热门文章
- IC卡、ID卡、CPU卡、RFID、NFC大致区分一览表
- python自动生成字幕脚本_自动生成字幕软件?
- 神州数码DC交换机VSF配置命令
- 步进电机驱动器介绍 --PWM
- 欧派caxa设计软件_CAXA软件三维设计的基本使用方法
- php抖音跳转地址,PHP如何实现解析抖音无水印视频
- fluidsim元件库下载_模块七FluidSIM软件应用 (1)
- FluidSIM3.6 安装 FluidSIM4.2
- OFFICE与VISIO安装tips:版本不能并行、visio安装错误
- PCL点云数据处理-滤波基础(C++)