精华内容
下载资源
问答
  • 案例:正则表达式表单验证 js小案例
    2020-12-24 20:10:06

    案例:正则表达式表单验证 js小案例


    功能需求:

    1. 如果用户名输入合法, 则后面提示信息为: 用户名合法,并且颜色为绿色 2. 如果用户名输入不合法, 则后面提示信息为: 用户名不符合规范, 并且颜色为红色

    页面展示:

    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述


    案例分析:

    1. 用户名只能为英文字母,数字,下划线或者短横线组成, 并且用户名长度为6~16位. 2. 首先准备好这种正则表达式模式/$[a-zA-Z0-9-_]{6,16}^/ 3. 当表单失去焦点就开始验证. 4. 如果符合正则规范, 则让后面的span标签添加 right类. 5. 如果不符合正则规范, 则让后面的span标签添加 wrong类

    核心代码:

    <input type="text" class="uname">
    <span>请输入用户名</span>
    <script>
        var reg = /^[a-zA-Z0-9_-]{6,16}$/;
        var uname = document.querySelector('.uname');
        var span = document.querySelector('span');
        uname.onblur = function () {
            if (reg.test(this.value)) {
                console.log('正确的');
                span.className = 'right';
                span.innerHTML = '用户名格式输入正确';
            } else {
                console.log('错误的');
                span.className = 'wrong';
                span.innerHTML = '用户名格式输入不正确';
            }
        }
    </script>
    

    源码下载

    https://download.csdn.net/download/chuenst/13773316

    更多相关内容
  • 基于bootstrap写的正则表达式,一共有7种表达类型,输入框输入显示数字,显示数字输入框输入显示字母,显示字母,.文本框只能输入数字代码,只能输入数字和小数点,数字和小数点,只能输入英文字母和数字,不能输入...
  • 本篇文章主要介绍了js正则表达式验证表单的实例,具有很好的参考价值。下面跟着小编一起来看下吧
  • js正则表达式表单验证小案例
  • 正则表达式使用详解 简介 简单的说,正则表达式是一种可以用于模式匹配和替换的强有力的工具。其作用如下:测试字符串的某个模式。例如,可以对一个输入字符串进行测试,看在该字符串是否存在一个电话号码模式或一个...
  • 正则表达式:”^[\u4e00-\u9fa5]{0,}$” 、 “/^[\u4E00-\u9FA5]{1,5}$/” 的含义: 在JS里,\uXXXX 是转义字符,”XXXX”对应的是16进制Unicode编码; ^ 匹配一行的开始。例如正则表达式^123能够匹配字符串”12345″...
  •  很多时候我们都是通过一组正则表达式来判断用户输入的身份证是否合法,那在用正则表达式判断之前,你对身份证号的组成有多少了解呢?下面来说说一个身份证号里面包含了多少的信息:  1、号码的结构  公民身份...
  • js正则表达式表单验证代码是一款支持多种不同条件不同效果的表单验证代码
  • 首先说下 我的需求 我要对一个文本框中输入的内容格式做出要求 ... 您可能感兴趣的文章:Jquery Validate 正则表达式实用验证代码大全js正则表达式验证表单(比较齐全的资源)js验证电话号码手机号码的正则表达式js
  • 具体和函数结合的使用方法,还请查看下篇文章 JavaScript 使用正则表达式进行表单验证的示例代码 代码如下:匹配中文字符的正则表达式: [u4e00-u9fa5] 评注:匹配中文还真是个头疼的事,有了这个表达式就好办了 匹配...
  • js正则表达式表单验证代码是一款支持多种不同条件不同效果的表单验证代码
  • js正则表达式表单验证代码是一款支持多种不同条件不同效果的表单验证代码
  • 在学习网页中的表单验证,顺便学习下正则表达式 在网上找了后发现了一个比较齐全的资源,稍微进行了一下排版 代码如下: // 检查是否为有效的真实姓名,只能含有中文或大写的英文字母 function isValidTrueName...
  • 正则表达式方式的验证方式,这个验证比较标准而且比较全面,不过也是通过点击提交按钮才进行验证,本实例可以这样验证,具体内容如下  也可以这样验证 具体代码 <html> <head> <meta ...
  • 方法一: 做项目的时候可能会遇到用js验证表单输入正确性的需求,这时候就需要用到js正则表达式。举个例子:比如说要验证月份,格式为:’yyyy-MM’,这个正则表达式写起来很简单,实在写不出,也可以Google、百度...
  • 主要介绍了JS常见简单正则表达式验证功能,结合实例形式总结分析了JS针对手机,地址,企业税号,金额,身份证等的常见验证技巧,需要的朋友可以参考下
  • 主要介绍了JS正则表达式封装与使用操作,涉及javascript使用正则表达式针对邮箱、手机号、身份证、用户名、中文等简单验证操作技巧,需要的朋友可以参考下
  • 本文实例讲述了JS使用正则表达式实现常用的表单验证功能。分享给大家供大家参考,具体如下: 表单验证是一个网站或应用的重点,一条合适的错误提示不仅可以减少无效信息录入,更会给用户留下良好的使用体验。但表单...
  • 主要介绍了JS基于正则表达式实现的密码强度验证功能,涉及javascript事件响应及基于正则的字符遍历、判断等相关操作技巧,需要的朋友可以参考下
  • 表单验证: 1、用户名:6–18位数字,字母,下划线_,文本域获取焦点和失去焦点出现提示文字。 2、登入密码:请输入6–20位数字,字母,任意字符,文本域获取焦点和失去焦点出现提示文字。(效果同上) 3、确认密码:...
  • 常用的正则表达式如下: 代码如下: “^-?[1-9]\\d*$”, //整数 “^[1-9]\\d*$”, //正整数 “^-[1-9]\\d*$”, //负整数 “^([+-]?)\\d*\\.?\\d+$”, //数字 “^[1-9]\\d*|0$”, //正数(正整数 + 0) “^-[1-9]\\d*|...
  • layui的正则表达式是在form表单中完成的。所以第一步要在你的html中加上指定的form 。 官方参考文档:https://www.layui.com/doc/element/form.html 要保证引用的layui模块中有form.js存在。 快速步骤引用form.js...
  • 废话不多说了,下面给大家介绍使用正则表达式验证用户名、密码、手机号码、身份证的写法,需要的的朋友参考下吧 //用户名 + (BOOL) validateUserName:(NSString *)name { NSString *userNameRegex = @"^[A-Za-z0-9...
  • 本文主要介绍了js利用正则表达式验证密码强度的实例,具有很好的参考价值。下面跟着小编一起来看下吧
  • JavaScript 表单验证正则表达式大全利用正则表达式判断是否是0-9的阿拉伯数字 代码如下: function regIsDigit(fData) { var reg = new RegExp(“^[0-9]$”); return (reg.test(fData)); } 利用这则表达式获取字符串...
  • js正则检验输入的是否为网址功能在网页中也是很常见的,友情链接部分、表单填写个人主页的时候,使用JavaScript验证是否为网址。  这个检验不好写,最好还是使用正则表达式去认证。  规定,输入的东西只能是...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 31,319
精华内容 12,527
关键字:

js正则表达式表单验证