js身份证验证超强脚本

yizhihongxing

JS身份证验证超强脚本攻略

什么是JS身份证验证超强脚本

JS身份证验证超强脚本是一段用于校验中国大陆居民身份证号码有效性的前端脚本。其可将正确性高效准确地校验输入的身份证号码,并通过提示用户输入正确的格式。使用此脚本可以有效防止用户在填写表单时可能出现的错误。

如何使用JS身份证验证超强脚本

首先,我们需要从GitHub等开源社区中找到我们需要的JS文件并将其下载下来,然后将其引入我们需要使用该脚本的网页中。一般的做法是将JS文件放置在自己网站的服务器上,然后通过<script>标签引入。

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>JS身份证验证</title>
  <script src="id_card_check.js"></script>    <!-- 引入JS文件 -->
</head>
<body>
  <label for="idcard">身份证号码:</label>
  <input type="text" id="idcard" name="idcard" onblur="checkIdCard(this.value)">
  <!-- onblur事件监听输入框的失去焦点事件,触发checkIdCard函数进行校验-->
  <div id="result"></div>
  <!-- 用于在网页中显示校验结果 -->
</body>
</html>

在我们的JS文件中,需要编写一个名为checkIdCard的函数,用来进行身份证校验:

function checkIdCard(idcard) {
  var regIdCard = /^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|[xX])$/;
  // 正则表达式判断身份证是否符合18位模式
  var cityName = {
    11: '北京',
    12: '天津',
    13: '河北',
    // …… (省份和城市对应的简称省略)
  };
  if(regIdCard.test(idcard)) {
    var dd = idcard.substring(0, 2);   //取得前两位
    var city = cityName[dd];
    var province = city==undefined?'非大陆身份证':city+'市';  //某些省份没有市,显示为省名
    var year = idcard.substring(6, 10);
    var month = idcard.substring(10, 12);
    var day = idcard.substring(12, 14);
    var sex = parseInt(idcard.substring(16, 17))%2==0?'女':'男';
    var res = '您输入的身份证号码是:'+province+year+'年'+month+'月'+day+'日出生的'+sex+'性身份证号码';
    document.getElementById('result').innerHTML = res;
    // 显示结果
  } else {
      document.getElementById('result').innerHTML = '请输入正确的身份证号码!';
      // 提示用户输入正确的身份证号码格式
  }
}

JS身份证验证超强脚本的示例说明

示例1

假如用户输入的身份证号码为340524199311170019。如果调用了checkIdCard函数,根据JS身份证验证超强脚本的规则,我们会得到如下输出结果:

<div id="result">您输入的身份证号码是:安徽省1993年11月17日出生的男性身份证号码</div>

示例2

假如用户输入的身份证号码为34052419931117001X。如果调用了checkIdCard函数,根据JS身份证验证超强脚本的规则,我们会得到如下输出结果:

<div id="result">您输入的身份证号码是:安徽省1993年11月17日出生的男性身份证号码</div>

结束语

JS身份证验证超强脚本是一段非常实用的前端脚本,适用于各种身份证号码格式的校验,并可以快速提示用户输入正确的身份证号码格式。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:js身份证验证超强脚本 - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • 利用jquery的获取JS文件中的字符串内容

    获取 JS 文件中的字符串内容,可以使用 jQuery 的 AJAX 功能来实现。具体步骤如下: 使用 $.get() 或 $.ajax() 函数向指定的 JS 文件发送 HTTP 请求,获取文件内容。 示例1: $.get(‘script.js’, function(data) { console.log(data); }); 在这个示例中,我们使用 $.…

    JavaScript 2023年5月27日
    00
  • js 判断上传文件大小及格式代码

    下面是关于 JS 判断上传文件大小及格式的完整攻略。 判断上传文件大小 如果想在上传文件时限制上传文件大小,可以使用以下代码进行判断: const fileSizeLimit = 1024 * 1024; // 限制 1MB const file = document.querySelector(‘input[type="file"]’)…

    JavaScript 2023年5月27日
    00
  • JS弹出新窗口被拦截的解决方法

    JS弹出新窗口的功能是在网页中常用的,但在很多情况下,弹出的新窗口会被浏览器的弹窗拦截器所拦截,导致网页运行结果不如预期。本篇攻略将会提供几种JS弹窗被拦截的解决方法。 一、使用window.open()打开新窗口 常规的弹出新窗口实现方式是使用window.open()方法,在这种情况下,浏览器的弹窗拦截器很容易就将其拦截。为了避免这种情况,我们可以设定新…

    JavaScript 2023年6月11日
    00
  • 适用于javascript开发者的Processing.js入门教程

    适用于JavaScript开发者的Processing.js入门教程 什么是Processing.js Processing.js是一个基于JavaScript语言的绘图库,可以帮助我们使用JavaScript绘制出各种有趣的形状和图案。Processing.js底层是使用Java语言实现的,如果你之前有使用过Processing的话,那么你会很快上手Pro…

    JavaScript 2023年5月27日
    00
  • Three.js+React制作3D梦中海岛效果

    下面我将详细讲解“Three.js+React制作3D梦中海岛效果”的完整攻略。 简介 Three.js是一款JavaScript 3D库,它可以为我们简化3D场景的创建和管理。React是一款流行的JavaScript库,它可以让我们更容易地构建用户界面。将这两个库结合起来,我们可以更加高效的创建3D界面。 在本攻略中,我们将使用Three.js和Reac…

    JavaScript 2023年6月10日
    00
  • JavaScript对象引用与赋值实例详解

    JavaScript对象引用与赋值实例详解 在JavaScript中,有很多时候我们会需要操作对象(Object)。对象是JavaScript中最基本的数据结构之一,而且在JavaScript中,对象是一种引用类型的数据。 这就引出了一个问题,即JavaScript中对象引用和赋值的问题。该问题会在实际的开发中经常遇到,也会给我们带来一些困惑和不好的体验。本…

    JavaScript 2023年5月27日
    00
  • js的写法基础分析

    我很乐意为你详细讲解“js的写法基础分析”的完整攻略。 标题 JS的写法基础分析 简介 在本篇文章中,你将学到JS的基础写法,包含变量定义、函数定义以及条件判断与循环等内容。同时,文章会使用两个实例帮助你更好地理解JS的写法基础。 变量定义 在JS中,变量定义是非常重要的基础内容。定义变量时,我们需要遵循以下规则: 变量的名称必须以字母、下划线或美元符号开头…

    JavaScript 2023年5月18日
    00
  • JS实现点击事件统计的简单实例

    这里我来详细讲解一下如何实现“JS实现点击事件统计的简单实例”,步骤如下: 步骤一:添加代码 首先,我们需要在网页中添加一个JS脚本来实现点击事件统计的功能。在网页的html文件中添加以下代码: <script type="text/javascript"> document.addEventListener("cl…

    JavaScript 2023年6月11日
    00
合作推广
合作推广
分享本页
返回顶部