自学web前端练手——js正则表达式实现表单验证

最新推荐文章于 2023-10-26 16:14:35 发布

lvshaoshishang

最新推荐文章于 2023-10-26 16:14:35 发布

阅读量430

点赞数

分类专栏：自学web前端文章标签： html css javascript

本文链接：https://blog.csdn.net/lvshaoshishang/article/details/104863800

版权

本文介绍了如何使用JavaScript正则表达式来实现表单验证，包括检查用户名是否由字母、数字、下划线组成且以字母开头，长度在4-16位，以及密码是否由4-16位字符组成。验证成功后，数据将发送到123.php。

摘要由CSDN通过智能技术生成

利用正则表达式来判断用户名是否“由字母、数字、下划线组成，字母开头，限制在4-16位”；判断密码是否“由4-16位字符组成”。
为了保护密码隐私性故令密码input的type=“password”，使输入的密码不可见。

效果如下：
在这里插入图片描述

若成功验证则向123.php发送数据。

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
	#main{
   
		width: 200px;
		height: 200px;
		margin:

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

lvshaoshishang

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

正则表达式(regex)或操作符”|“使用易出现功能Bug|angluo-re-132552.pdf

10-23

其次，正则表达式的正确构造对于其功能的实现至关重要。在上文提供的PHP代码示例中，原本的意图是匹配以“abc”或“bcd”开头，后接数字的字符串。但如不正确使用括号，就会得到错误的结果，代码中的正则表达式“/...

用正则表式表示用户名只能为英文字母或数字或下划线或者短横线组成,，并且用户名长度为 6~16位...

weixin_42599558的博客

01-10

1720

正则表达式为：^[a-zA-Z0-9_-]{6,16}$ 翻译一下： ^ 表示字符串的开头 [] 表示匹配方括号内的任意一个字符 a-zA-Z0-9 表示匹配所有小写字母、大写字母和数字 _ 表示匹配下划线表示匹配短横线 {6,16} 表示匹配前面的表达式至少 6 次，最多 16 次 $ 表示字符串的结尾所以这个正则表达式的意思就是：匹配以小写字母、大写字母、数字、下划线或短横线组成，且长...

参与评论您还未登录，请先登录后发表或查看评论

js 随机生成大小写字母数字16位数

最新发布

敲代码无敌小奶龙的博客

10-26

925

【代码】js 随机生成大小写字母数字16位数。

JS正则表达式写法：手机号、邮箱、用户只能由英文字母或数字组成，长度为4-16个字符，并且以英文字母开头

weixin_45921972的博客

11-29

3358

1、手机号：以136，138，150开头，27894678 2、邮箱：4478@qq/163.com/cn 3、用户只能由英文字母或数字组成，长度为4-16个字符，并且以英文字母开头 <script type="text/javascript"> //匹配四个一样的字符 // \1反向引用第一组 // \2反向引用第二组 // var reg = /([a-z])\1\1\1(\d)\2\2/g; // var str ="aaaa3333" // .

JavaScript高级

Viking0226的博客

03-26

458

JavaScript高级案例一使用JS完成表单的校验plus 一,案例需求 用户名输入框,电子邮箱, 手机号码 , 获得焦点的时候给用户提示, 失去焦点进行校验 用户名：只能由英文字母和数字组成，长度为4～16个字符，并且以英文字母开头手机号：以1开头, 第二为是3,4,5,7,8的11位数字 /^1[34578]\d{9}$/ 二,技术分析 1.js使用正则表达式 1.1正则...

JS正则表达式

h294590501的专栏

05-30

2918

JS正则表达式正则表达式的规则一个具有特殊意义的字符串。 正则表达式在多种语言中都可以使用，如：在 Java 中可以用正则表达式，在JavaScript 中也可以使用正则表达式。\d 数字 \D 非数字 \w 单词：a-zA-Z0-9_ //注意包括下划线 \W 非单词 . 通配符，匹配任意字符 {n} 匹配 n 次 {n,} 大于或等于 n 次 {n,m} 在 n 和 m 之间 ...

python基础教程：基于Python正则表达式提取搜索结果中的站点地址

12-21

Python正则表达式是Python语言中用于处理字符串的强大工具，尤其在数据提取和文本处理方面。在本教程中，我们将探讨如何使用Python正则表达式从Google搜索结果中提取站点地址。首先，我们需要理解问题的核心：从...

易语言-易语言正则表达式对象类模块

06-29

自学编程网提供的这个模块源码，可以作为学习易语言正则表达式的实例。通过阅读和分析代码，你可以更直观地了解每个步骤的实现方式，并且能够灵活运用到自己的项目中。在实践中，不断尝试和调试，是掌握易语言正则...

猛男表白案例——自学web前端

11-29

在IT行业中，Web前端开发是构建互联网应用的重要一环，尤其对于那些想要向技术领域进发的“猛男”来说，掌握Web前端技术不仅可以提升个人技能，还可能为生活增添浪漫色彩，比如制作一个独特的表白网页。下面我们将...

js 正则以字母开头必须有大小写字母数字组成可以有“@"或 ”.“

weixin_30858241的博客

01-28

1161

js 正则以字母开头必须有大小写字母数字组成可以有“@"或 ”.“ var reg = /^[a-zA-Z]{1}(?=.*[a-z])(?=.*[A-Z])[a-zA-Z\d_@\.]{6,16}$/; var v = reg.test(str); alert(v); //校验是否全由数字组成 function isDigit(s) { var patrn=/^...

转载JavaScript的对正则表达式的总结

qq_38829237的博客

05-14

203

一、校验数字的表达式数字：1*$ n位的数字：^d{n}$ 至少n位的数字：^d{n,}$ m-n位的数字：^d{m,n}$ 零和非零开头的数字：^(0|[1-9][0-9]*)$ 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$ 带1-2位小数的正数或负数：^(-)?d+(.d{1,2})?$ 正数、负数、和小数：^(-|+)?d+(.d+)?$ ...

【JS】判断用户输入的用户名首位是否是字母

m0_61486963的博客

07-24

1223

判断用户输入的用户名首位是否是字母，codepen演示

使用正则表达式进行用户名验证

Maple_hucui的博客

11-05

1013

使用正则表达式进行用户名验证 public static void main(String[] args) { String userName = "Banana"; //用户名首字母必须大写A-Z //可用字符a-zA-Z和下划线 //最少5位字符最多15位 Pattern pattern = Pattern.compile("^[A-Z][\\w]{4,14}&");//创建比较模板 Matc

实现用户名字母数字大小写符号（正则表达式）

mantangjojo的博客

10-21

3972

又称规则表达式（Regular Expression，在代码中常简写为regex、regexp或RE），是一种文本模式，包括普通字符（例如，a 到 z 之间的字母）和特殊字符（称为"元字符"），是计算机科学的一个概念。正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串，通常被用来检索、替换那些符合某个模式（规则）的文本。1. 灵活性、逻辑性和功能性非常强；2. 可以迅速地用极简单的方式达到字符串的复杂控制。^(?!!!!

JS的常用正则表达式 验证密码用户名等

05-29

132

JS的正则表达式 //校验是否全由数字组成 function isDigit(s){var patrn=/^[0-9]{1,20}$/;if (!patrn.exec(s)) return falsereturn true} //校验登录名：只能输入5-20个以字母开头、可带数字、“_”、“.”的字串Java代码function isRegisterUserName(s)...

正则表达式案例：用户名验证

icemwj的博客

08-19

8114

案例：用户名验证功能需求：如果用户名输入合法，则后面提示信息为： 用户名合法，并且颜色为绿色。如果用户名输入不合法，则后面提示信息为： 用户名不符合规范，并且颜色为红色。分析: 用户名只能为英文字母，数字，下划线或者短横线组成,，并且用户名长度为 6~16位。首先准备好这种正则表达式模式 /$[a-zA-Z0-9-_]{6,16}^/ 当表单失去焦点就开始验证。如果符合正则规范,，则让后面的 span 标签添加 right 类。如果不符合正则规范，则让后面的 span 标签添加 w

js验证用户名是否合法

qq_48517846的博客

03-13

7143

js验证用户名是否合法，正则表达式的应用

JS——校验验证码字符串为4-8位数字

月来better

10-08

1095

let code = '677899';//待校验的字符串 let reg = /^\d{4,8}$/;//正则表达式 console.log(reg.test(code)) //true

30分钟快速掌握正则表达式基础

"正则表达式自学文档，30分钟学会正则表达式" 正则表达式（Regular Expression，简称regex或regexp）是一种强大的文本处理工具，它使用一种特殊的符号语言来描述字符串模式，用于匹配、查找、替换、分割等操作。在...