JavaScript——利用正则表达式实现二代身份证号码的验证

JavaScript——利用正则表达式实现二代身份证号码的验证HTML<divclass=”login-header”><aid=”link”>点击,弹出登录框</a></div><divclass=”box”id=”box”><divclass=”hd”id=”drop”>注册信息(可以拖拽)<spanid=”box_close”>[关闭]</span></div><divclas

大家好,又见面了,我是你们的朋友全栈君。

HTML

<div class="login-header"><a id="link">点击,弹出登录框</a></div>
<div class="box" id="box">
    <div class="hd" id="drop">注册信息 (可以拖拽)
        <span id="box_close">[关闭]</span>
    </div>
    <div class="bd"></div>
</div>

 CSS样式

<style>
    .login-header { width: 100%;text-align: center;height: 30px; font-size: 24px;line-height: 30px;}
    * {margin: 0;padding: 0;}
    .box { width: 400px; height: 300px;border: 5px solid #eee;box-shadow: 2px 2px 2px 2px #666;position: absolute;top: 15%;left: 30%;display: none;}
    .hd { width: 100%; height: 25px; background-color: #7c9299; border-bottom: 1px solid #369; line-height: 25px; color: white;cursor: move;}
    #box_close {float: right; cursor: pointer;}
</style>

JavaScript处理键盘事件

<script>
    // 获取“点击,弹出登录框”的链接、登录框的关闭按钮、登录框、页面背景色
    var link = document.getElementById("link");
    var closeBtn = document.getElementById("box_close");
    var login = document.getElementById("box");
    // 点击登录 显示登录框和遮罩
    link.onclick = function () { 
        login.style.display = "block";
    }
    // 点击关闭按钮 隐藏登录框和遮罩
    closeBtn.onclick = function () {
        login.style.display = "none";
    }
    // 按下键盘上的ESC键 隐藏登录框和遮罩
    document.onkeydown = function (e) {
        console.log(e.keyCode);//ESC键的键盘码是27
        if (e.keyCode === 27) {
            closeBtn.onclick();
        }
    }
</script>

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/153635.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • C语言开发简单的学生成绩管理系统(附源码)

    C语言开发简单的学生成绩管理系统(附源码)学生成绩管理系统开发语言:C语言开发工具:VisualStudio2019开发时间:2019.4.14开发者:summer@一、系统使用展示@二、系统功能@三、菜单@四、录入学生信息@五、打印学生信息@六、保存学生信息@七、读取学生信息@八、统计所有学生人数@九、查找学生信息@十、修改学生信息@十一、删除学生信息@十二、退出系统@十三、出错一、系统使用展示…

  • 挖矿病毒分析[通俗易懂]

    挖矿病毒分析[通俗易懂]病毒样本分析样本要求确定二进制文件类型给出钱包地址的IOC特征文件类型:PE64脱壳upx.exe-dsvhostd.jpg.virus钱包地址的IOC特征云沙箱自动分析

  • C语言——五子棋人机对战

    C语言——五子棋人机对战         先说下背景吧,写下这篇博客时,博主大一在读,C语言初学者,寒假无事,便计划写几个由C语言实现的小游戏以提升编程能力。在这篇博客里分享的是可人机对战的五子棋游戏。         棋类游戏要实现初级的机器智能,其核心思想便是:感知(SENSE)-&gt;思考(THINK)-&gt;行动(ACT)。所以,本文将尽量以这个顺序介绍实现过程。(1)前期准备:    此程序中,机器…

  • java中%c%n是什么意思_在编码时如何使用\r与\n,两者的区别

    java中%c%n是什么意思_在编码时如何使用\r与\n,两者的区别\r与\n到底有何区别,编码的时候又应该如何使用,我们下面来了解一下。区别:\r:全称:carriagereturn(carriage是“字车”的意思,打印机上的一个部件)简称:return缩写:rASCII码:13作用:把光标移动到当前行的最左边\n:全称:newline别名:linefeed缩写:nASCII码:10作用:把光标向下移动一行不同操作系统怎样表示“回车+换行”(即一行的结…

  • windows环境下tomcat部署war包[通俗易懂]

    windows环境下tomcat部署war包[通俗易懂]1.从Eclipse中将项目打包成war包,Runas&gt;&gt;MavenInstall,然后将war包放在tomcat\webapps下,如图所示2.然后运行tomcat\bin目录下的startup.bat(运行后悔在webapps下生成相应名称的目录)3.运行成功,使用Postman测试成功…

  • 【RPC Dubbo】dubbo负载均衡策略

    【RPC Dubbo】dubbo负载均衡策略文章目录前言参考前言在上一篇博客中,介绍了zookeeper作为dubbo的注册中心是如何工作的,有一个很重要的点,我们的程序是分布式应用,服务部署在几个节点(服务器)上,当消费者调用服务时,zk返回给dubbo的是一个节点列表,但是dubbo只会选择一台服务器,那么它究竟会选择哪一台呢?这就是dubbo的负载均衡策略了,本篇博客就来聚焦dubbo的负载均衡策略。参考dubbo负载均衡策略…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号