regex & form validation

https://regexper.com/

https://gitlab.com/javallone/regexper-static

https://github.com/javallone/regexper-static


/^(\w+)\:\/\/([^\/]+)\/(.*)$/ // telephone
/^0[0-9]{2,3}-[0-9]{3, 4}-[0-9]{4}$/ 0
021 8888 8888
0371 6666 7777
0370 567 8888 // cell phone / mobile phone
/^1[0-9]{2}-[0-9]{4}-[0-9]{4}$/ 1
181 3333 7777
177 6666 8888

https://regexper.com/#%2F^(\w%2B)\%3A\%2F\%2F([^\%2F]%2B)\%2F(.*)%24%2F


https://element.eleme.io/#/zh-CN/component/form#biao-dan-yan-zheng

https://element.eleme.io/#/zh-CN/component/input#input-attributes

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_<input>_types

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/tel




special-quantifier-range

no space between the comma!

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions#special-quantifier-range


regexSpaceBug() {
let pattern = /0[0-9]{2, 3}-[0-9]{3, 4}-[0-9]{4}/;
// /0[0-9]{2, 3}-[0-9]{3, 4}-[0-9]{4}/
pattern.test("021-6666-8888");
// false
pattern = /0[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}/;
// /0[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}/
pattern.test("021-6666-8888");
// true
pattern.test("0371-6666-8888");
// true
pattern.test("0370-333-8888");
// true
},


telephoneChange() {
let value = this.$data.form.telephoneNum;
console.log(`telephoneNum value =`, value);
},
phoneChange() {
let value = this.$data.form.phoneNum;
console.log(`phoneNum value =`, value);
},
telephoneInput() {
const pattern = /^0[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}$/;
let value = this.$data.form.telephoneNum;
if (pattern.test(value)) {
this.$data.show.telephoneNum = false;
} else {
if(value !== "") {
this.$data.show.telephoneNum = true;
this.$data.error.telephoneNum = `输入的电话号码不符合格式, ${pattern.toString()}`;
} else {
this.$data.show.telephoneNum = false;
}
}
},
phoneInput() {
const pattern = /^1[0-9]{2}-[0-9]{4}-[0-9]{4}$/;
let value = this.$data.form.phoneNum;
if (pattern.test(value)) {
this.$data.show.phoneNum = false;
} else {
if(value !== "") {
this.$data.show.phoneNum = true;
this.$data.error.phoneNum = `输入的手机号码不符合格式, ${pattern.toString()}`;
} else {
this.$data.show.phoneNum = false;
}
}
},

email validation

https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript

https://www.sitepoint.com/javascript-validate-email-address-regex/

https://www.w3resource.com/javascript/form/email-validation.php

https://www.regextester.com/19


regex & form validation & phone的更多相关文章

  1. asp.net Core MVC + form validation + ajax form 笔记

    asp.net Core MVC 有特别处理form,controller可以自己处理model的验证,最大的优势是写form时可以少写代码 先了解tag helper ,这东西就是element上的 ...

  2. Regex Password Validation

    You need to write regex that will validate a password to make sure it meets the follwing criteria: A ...

  3. [Angular2 Form] Validation message for Reactive form

    <div class="form-field"> <label>Confirm Password: </label> <input typ ...

  4. jQuery 验证 Validation

    jQuery Validation 目录 简介: Form validation made easy. Validate a simple comment form with inline rules ...

  5. Laravel教程 七:表单验证 Validation

    Laravel教程 七:表单验证 Validation 此文章为原创文章,未经同意,禁止转载. Laravel Form 终于要更新这个Laravel系列教程的第七篇了,期间去写了一点其他的东西. 就 ...

  6. 学习笔记(三): Generalization/Overfitting/Validation

      目录 Generalization: Peril of Overfitting Low loss, but still a bad model? How Do We Know If Our Mod ...

  7. JavaScript资源大全中文版(Awesome最新版)

    Awesome系列的JavaScript资源整理.awesome-javascript是sorrycc发起维护的 JS 资源列表,内容包括:包管理器.加载器.测试框架.运行器.QA.MVC框架和库.模 ...

  8. Awesome Swift

    Awesome Swift https://github.com/matteocrippa/awesome-swift A collaborative list of awesome Swift re ...

  9. 客官,您的 Flask 全家桶请收好

    http://www.factj.com/archives/543.html Flask-AppBuilder          - Simple and rapid Application buil ...

随机推荐

  1. 没有上司的舞会(树形DP)

    题目描述 某大学有N个职员,编号为1~N.他们之间有从属关系,也就是说他们的关系就像一棵以校长为根的树,父结点就是子结点的直接上司.现在有个周年庆宴会,宴会每邀请来一个职员都会增加一定的快乐指数Ri, ...

  2. 数字三角形W

    题目描述 Description 数字三角形 要求走到最后mod 100最大 输入描述 Input Description 第1行n,表示n行 第2到n+1行为每个的权值 输出描述 Output De ...

  3. jQuery代码解释(基本语法)

    html中jquery的以下用法 求解: var header = {}; header.ajaxCallComplete = false; header.login = false; header. ...

  4. 深度解析JQuery Dom元素操作技巧

    深度解析JQuery Dom元素操作技巧 DOM是一种与浏览器.平台.语言无关的接口,使用该接口可以轻松访问页面中所有的标准组件,这篇文章给大家介绍了JQuery dom元素操作方法,写的十分的全面细 ...

  5. 吐血分享:QQ群霸屏技术教程2017(活跃篇)

    热门词的群排名,在前期优化准备充分的情况下,活跃度不失为必杀技. 在<吐血分享:QQ群霸屏技术(初级篇)>中,我们提及到热门词的群排名,有了前面的基础,我们就可以进入深度优化,实现绝对的霸 ...

  6. python 连接MSSQL

    # -*- coding: utf-8 -*- import pymssql conn=pymssql.connect(host=".",user="sa",p ...

  7. HashMap JDK1.8实现原理

    HashMap概述 HashMap存储的是key-value的键值对,允许key为null,也允许value为null.HashMap内部为数组+链表的结构,会根据key的hashCode值来确定数组 ...

  8. Linux 内核之api_man 手册安装

    开发环境:Ubuntu18.04,虚拟机virtual box 1.安装XML格式转换 sudo apt  install xmlto 2.在内核目录执行 make mandocs  大概持续了半小时 ...

  9. Scrapy核心组件

    • 引擎(Scrapy)用来处理整个系统的数据流处理, 触发事务(框架核心) • 调度器(Scheduler)用来接受引擎发过来的请求, 压入队列中, 并在引擎再次请求的时候返回. 可以想像成一个UR ...

  10. 字典树(Trie)的学习笔记

    按照一本通往下学,学到吐血了... 例题1 字典树模板题吗. 先讲讲字典树: 给出代码(太简单了...)! #include<cstdio> #include<cstring> ...