js实现填写身份证号、手机号、准考证号等信息自动空格的效果
咱们做网站的,用户体验那是相当重要的,比如12306抢票需要填写身份证,如果不空格,密密麻麻的给我一种很压抑的感觉,而且也不容易核对信息是否填写正确,所以我就写了一个利用Js实现填写身份证号、手机号、准考证号等信息自动空格的效果。
为了方便,自已定义的一个简单的get()方法和trim()方法,代码如下:
//获取对应的对象--function函数.
function get(id) {
return document.getElementById(id);
} //去掉所有空格--String类的属性.
String.prototype.trim = function () {
return this.replace(/\s+/g, "");
};
实例1:身份证号自动空格,支持18位的身份证号码,格式为"xxx xxx xxxx xxxx xxxx".
//身份证自动空格.
function FillIdentity() {
var idNumber = get("IDNumber");//页面上输入身份证号码的文本框的Id.
var idValue = idNumber.value.trim();
if (idValue != "") {
var idLength = idValue.length;
if (idLength <= 3) {
idNumber.value = idValue;
} else {
if (idLength <= 6) {
idNumber.value = idValue.substring(0, 3) + " " + idValue.substring(3, idLength);
} else {
if (idLength <= 10) {
idNumber.value = idValue.substring(0, 3) + " " + idValue.substring(3, 6) + " " + idValue.substring(6, idLength);
} else {
if (idLength <= 14) {
idNumber.value = idValue.substring(0, 3) + " " + idValue.substring(3, 6) + " " + idValue.substring(6, 10) + " " + idValue.substring(10, idLength);
} else {
idNumber.value = idValue.substring(0, 3) + " " + idValue.substring(3, 6) + " " + idValue.substring(6, 10) + " " + idValue.substring(10, 14) + " " + idValue.substring(14, idLength);
}
}
}
}
}
}
实例2:手机号码自动空格,支持11位的手机号码,格式为"xxx xxxx xxxx".
//手机号自动空格.
function FillMobile() {
var mobile = get("Mobile");//页面上输入手机号码的文本框的Id.
var mValue = mobile.value.trim();
if (mValue != "") {
var mLength = mValue.length;
if (mLength <= 3) {
mobile.value = mValue;
} else {
if (mLength <= 7) {
mobile.value = mValue.substring(0, 3) + " " + mValue.substring(3, mLength);
} else {
mobile.value = mValue.substring(0, 3) + " " + mValue.substring(3, 7) + " " + mValue.substring(7, mLength);
}
}
}
}
实例3:准考证号自动空格,没有固定的格式,简单来说就是"四位一空格",格式为"xxxx xxxx xxxx".
//准考证号自动空格.
function FillTicket() {
var ticket = get("Ticket");//页面上输入准考证号的文本框的Id.
var tValue = ticket.value.trim();
if (tValue != "") {
var tLength = tValue.length;
var count = parseInt(tLength / 4);
if (count >= 1) {
ticket.value = "";
for (var i = 1; i <= count; i++) {
ticket.value += tValue.substring((i - 1) * 4, (i) * 4);
if (tLength > (i * 4)) {//不加此判断会出现遇到空格按退格键无效的Bug.
ticket.value += " ";
}
}
ticket.value += tValue.substring(count * 4, tLength);
}
}
}
其他代码:
验证身份证号码是否正确,包括验证出生日期是否合法,校验码是否正确.
//能提示校验码的身份证号码验证方法.
function FillNumber() {
var num = get("IDNumber").value.trim();//页面上输入身份证号码的文本框的Id.
if (num == "") {
alert("请输入身份证号!");
return false;
}
num = num.toUpperCase();
//身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,最后一位是校验位,可能为数字或字符X(身份证上是大写)。
if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(num))) {
alert('温馨提示:\n\n输入的身份证号长度不对,或者号码不符合规定!\n15位号码应全为数字,18位号码末位可以为数字或X!');
return false;
}
//校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
//下面分别分析出生日期和校验位
var len, re;
len = num.length;
if (len == 15) {
if (isNaN(num)) {
alert("15位身份证号码只能为数字!");
return false;
}
re = new RegExp(/^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/);
var arrSplit = num.match(re); //检查生日日期是否正确.
var dtmBirth = new Date('19' + arrSplit[2] + '/' + arrSplit[3] + '/' + arrSplit[4]);
var bGoodDay;
bGoodDay = (dtmBirth.getYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
if (!bGoodDay) {
alert('温馨提示:\n\n您输入的身份证号码里出生日期不对,请确认后重新输入!');
return false;
}
else {
//将15位身份证转成18位
//校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
var arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
var arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
var nTemp = 0, i;
num = num.substr(0, 6) + '19' + num.substr(6, num.length - 6);
for (i = 0; i < 17; i++) {
nTemp += num.substr(i, 1) * arrInt[i];
}
num += arrCh[nTemp % 11];
alert("当前15位身份证号码正确!");
return num;
}
}
if (len == 18) {
if (isNaN(num.substring(0, 17))) {
alert("身份证号码前17位只能为数字!");
return false;
}
re = new RegExp(/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/);
var arrSplit = num.match(re); //检查生日日期是否正确
var dtmBirth = new Date(arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]);
var bGoodDay;
bGoodDay = (dtmBirth.getFullYear() == Number(arrSplit[2])) && ((dtmBirth.getMonth() + 1) == Number(arrSplit[3])) && (dtmBirth.getDate() == Number(arrSplit[4]));
if (!bGoodDay) {
//alert(dtmBirth.getYear());
//alert(arrSplit[2]);
alert('温馨提示:\n\n您输入的身份证号码里出生日期(' + arrSplit[2] + arrSplit[3] + arrSplit[4] + ')不对,请确认后重新输入!');
return false;
}
else {
if (isNaN(num.substring(17))&&num.substring(17) != "X") {
alert("18位身份证号码的校验码只能为0至9或者字母‘X’");
return false;
}
//检验18位身份证的校验码是否正确。
//校验位按照ISO 7064:1983.MOD 11-2的规定生成,X可以认为是数字10。
var valnum;
var arrInt = new Array(7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2);
var arrCh = new Array('1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2');
var nTemp = 0, i;
for (i = 0; i < 17; i++) {
nTemp += num.substr(i, 1) * arrInt[i];
}
valnum = arrCh[nTemp % 11];
if (valnum != num.substr(17, 1)) {
alert('温馨提示:\n\n18位身份证的校验码不正确,应该为:' + valnum + ",请您确认后重新输入!");
return false;
}
alert("当前18位身份证号码正确!");
return num;
}
}
}
js实现填写身份证号、手机号、准考证号等信息自动空格的效果的更多相关文章
- js 随机生成姓名、手机号、身份证号、银行卡号
开发测试的时候,经常需要填写姓名.手机号.身份证号.银行卡号,既要符合格式要求.又不能重复.大家会到网上搜各种生成器.能不能自己写一个简单的生成器呢.下面是随机生成姓名.手机号.身份证号.银行卡号的j ...
- python:利用urllib查找计算机二级准考证号
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAaYAAAEACAIAAAB3VkWnAAAgAElEQVR4nOydZ3gUR9bv+WhExhHnDH
- 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app
一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app 转载 作者:jrainlau 链接:https://segmentfault.com/a/1190000005844155 ...
- NOIP模拟赛 准考证号
准考证号 128M 0.1s ticket.cpp escription 蒟蒻hzwer NOIP2014惨跪,他依稀记得他的准考证号是37,现在hzwer又将要面临一场比赛,他希望准考证号不出现37 ...
- js中单引号和双引号的区别(html中属性规范是用双引号,js中字符串规定是用单引号)(js中单引号区别和php很像:单引号快,双引号可转义字符,双引号可解析变量)
js中单引号和双引号的区别(html中属性规范是用双引号,js中字符串规定是用单引号)(js中单引号区别和php很像:单引号快,双引号可转义字符,双引号可解析变量) 一.总结 1.html中属性规范是 ...
- JS正则表达式验证账号、手机号、电话和邮箱
JS正则表达式验证账号.手机号.电话和邮箱 效果体验:http://keleyi.com/keleyi/phtml/jstexiao/15.htm 验证帐号是否合法 验证规则:字母.数字.下划线组成, ...
- 微信公众号_订阅号_access_token_创建菜单_菜单name+表情
全局唯一接口调用凭据 access_token 用于接口调用的一个必要参数 有了 access_token 就能实现所有的接口 特点: 1. 有效期为 2 小时,所以 2 小时要更新一次,提前 5 ...
- 对网页接口的追踪探索(以b站通过bv号查询av号为例
对网页接口的追踪探索(以b站通过bv号查询av号为例 序言 本文只提供一种探索网页加载时后端访问接口情况的思路,所举例子没有太大实际用处. 一 自2020年3月23日起,AV号将全面升级到BV号.但是 ...
- 分区里的inode号是0号和1号的block
分区里的inode号是0号和1号的block 我相信大家在使用Linux的时候都遇到过误删文件系统数据的情况,不管是自己误删还是帮人家恢复误删 现在用的比较多的恢复工具大概是ext3grep .ext ...
随机推荐
- java 中的容器(札记)
创建容器向上转型为接口的时候,有时候,并不是一定可行的,因为有的实现类,在接口的基础添加了自己的方法:比如:List 接口下面的 LinkedList 自己定义了一些方法 : Arrays.asLis ...
- ARTS 第十周打卡
Algorithm : 做一个 leetcode 的算法题 编写一个函数来查找字符串数组中的最长公共前缀. 如果不存在公共前缀,返回空字符串 "". 示例 1: 输入: [&quo ...
- 单例模式中volatile关键字的作用
背景&问题 在早期的JVM中,synchronized存在巨大的性能开销.因此,有人想出了一个"聪明"的技巧:双重检查锁定(Double-Checked Locking). ...
- 【C#】上机实验一
1.开发一个控制台应用程序,根据提示从键盘获取一个华氏温度,请转换并输出对应的摄氏温度. using System; namespace Project { class Program { publi ...
- 箭头函数的arguments不可用
ES5中的arguments function func(a,b,c){ console.log(arguments[0],arguments[1],arguments[2]) } func(1,2, ...
- (七)Redis之Keys的通用操作
package myRedis01; import java.util.HashMap; import java.util.List; import java.util.Map; import jav ...
- Java容器汇总【红黑树需要再次学习】
1,概述 2,Collection 2.1,Set[接触比较少] 2.1.1 TreeSet 底层由TreeMap实现 基于红黑树实现,支持有序性操作,例如根据一个范围查找元素的操作.但是查找效率不如 ...
- Nginx实现同一端口HTTP跳转HTTPS
小目标:在只监听一个端口的情况下,将http访问跳转为https. 一般情况下http协议使用80端口,https协议443端口.要实现http强制转https是非常简单的事,随便都可以找到很多方案. ...
- shell脚本使用记录
一些比较功能需求比较简单的可以考虑使用shell脚本来写,这样可以方便快捷稳定 1. 读取文件值,根据文件值1 或 0 来开启和关闭某些程序 a. while : do done 是无限循环. b. ...
- Linux--CentOS 安装 Docker 教程
本文主要介绍 CentOS 系统安装 Docker 的流程. 前提条件 OS 要求 CentOS7: The centos-extras repository must be enabled. Thi ...