通过正则表达式检验前端表格的方法

最新推荐文章于 2024-08-20 21:14:58 发布

云南仟龙Mark

最新推荐文章于 2024-08-20 21:14:58 发布

阅读量157

点赞数

文章标签： json css html

原文链接：https://blog.51cto.com/u_15111999/4514785

版权

本文详细介绍了如何使用JavaScript正则表达式在前端表格中进行数据验证，包括用户名、密码、身份证、座机号和手机号码等字段的规则检查。通过实例代码展示了如何实现这些验证功能，有助于提升前端表单数据的准确性和安全性。

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

今天分享下”通过正则表达式检验前端表格的方法“这篇文章，文中根据实例编码详细介绍，或许对大家的编程之路有着一定的参考空间与使用价值，需要的朋友接下来跟着云南仟龙Mark一起学习一下吧。下面给大家分享HTML用正则表达式检验表格的实例代码，具体代码内容如下所示：

<span style="font-size:24px;color:#cc6600;“> 正则表达式在JavaScript脚本中是很好用的检验语法规则的方法。但是与Java中的正则表达式有所不同。它需要在regex规则上以“^”开始，以”$"结束。</span>

<span style="font-size:24px;color:#cc6600;">以下让我们看看一个实例。</span>

<head>

<title>Title</title>

<style>

form table tr td{

border: 1px solid lightgrey;

text-align: center;

}

form table tr td input{

width: 97%;

}

</style>

//判断规则（正则表达式）

function goto() {

var name = document.getElementById(“name”);

var pwd = document.getElementById(“pwd”);

var pwd2 = document.getElementById(“pwd2”);

var pnum = document.getElementById(“pnum”);

var phone = document.getElementById(“phone”);

var telephone = document.getElementById(“telephone”);

var email = document.getElementById(“email”);

if (name.value.trim().length<=8){

alert(“用户名长度必须大于八位”);

name.focus()

name.value="";

return;

}

// 规则必须包括大小写字母，数字

var regex = /^(?!(?:\d+|[a-zA-Z]+|[\da-z]+|[\dA-Z]) $KaTeX parse error: Undefined control sequence: \da at position 3: )[\̲d̲a̲-zA-Z]{6,}$ /;

// var regex = /¹{10,20}$/;

if ( !pwd.value.match(regex)){

alert(“密码不符合规定”);

pwd.focus()

pwd.value="";

return;

}

if (pwd.value != pwd2.value){

alert(“两次输入的密码不相同”);

pwd2.focus()

pwd.value="";

pwd2.value="";

return;

}

var rege=/^\d{17}X $KaTeX parse error: Undefined control sequence: \d at position 3: |^\̲d̲{15}$ /;

if (!rege.test(pnum.value)){

alert(“身份证不符合规定”);

pnum.focus()

pnum.value="";

return;

}

var regex2 = /^\d{4}-\d{7}$/;//判断座机号

if (!regex2.test(phone.value)){

alert(“座机号码不符合规定”);

phone.focus()

phone.value="";

return;

}

var regex3 = /^1[3,5,7,8]\d{9}$/;

if (!regex3.test(telephone.value)){

alert(“手机号码不符合规定”);

telephone.focus(http://www.qlyl1688.com/products/kewhq.html)

telephone.value="";

return;

}

//test方法必须用反斜杠转义

var regex4 = /^\w+([-+.]\w+)@\w+([-.]\w+).\w+([-.]\w+)*$/;

if (!regex4.test(email.value)){

alert(“邮箱不符合规定”);

email.focus()

email.value="";

return;

}

</script>

</head>

<body>

<form>

<tr>

<td width="50%">长度大于八位</td>

</tr>

<tr>

<td>长度大于十位，包含字母数字</td>

</textarea></td>

</tr>

<tr>

</tr>

<tr>

<td>身份证号码:</td>

<td>15位或18位最后一个是X</td>

</tr>

<tr>

<td>格式xxxx-xxxxxxx</td>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</select></td>

</select></td>

</tr>

<tr>

</tr>

</table>

</form>

</body>

</html></span>

附:一些常使用的规则：

“^\d+$”　　//非负整数（正整数 + 0）

“²[1-9][0-9]$”　　//正整数

“^((-\d+)|(0+))$”　　//非正整数（负整数 + 0）

“^-[0-9][1-9][0-9]$”　　//负整数

“^-?\d+$”　　　　//整数

“^\d+( \.\d+)?$”　　//非负浮点数（正浮点数 + 0）

“^(([0-9]+\.[0-9][1-9][0-9])|([0-9][1-9][0-9]\.[0-9]+)|([0-9][1-9][0-9]))$”　　//正浮点数

“^((-\d+( \.\d+)?)|(0+(\.0+)?))$”　　//非正浮点数（负浮点数 + 0）

“^(-(([0-9]+\.[0-9][1-9][0-9])|([0-9][1-9][0-9]\.[0-9]+)|([0-9][1-9][0-9])))$”　　//负浮点数

“^(-?\d+)( \.\d+)?$”　　//浮点数

“³+$”　　//由26个英文字母组成的字符串

“⁴+$”　　//由26个英文字母的大写组成的字符串

“⁵+$”　　//由26个英文字母的小写组成的字符串

“⁶+$”　　//由数字和26个英文字母组成的字符串

“^\w+$”　　//由数字、26个英文字母或者下划线组成的字符串

“⁷+( \.[\w-]+)*@[\w-]+(\.[\w-]+)+$”　　　　//email地址

“⁸+://( \w+(-\w+))(\.(\w+(-\w+)))(\?\S)?$”　　//url

以上是云南仟龙Mark给大家介绍的所有内容,希望对大家有所帮助，如果大家有任何疑问请在脚本之家留言，如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

A-z0-9 ↩︎
0-9 ↩︎
A-Za-z ↩︎
A-Z ↩︎
a-z ↩︎
A-Za-z0-9 ↩︎
\w- ↩︎
a-zA-z ↩︎

云南仟龙Mark

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
通过正则表达式检验前端表格的方法

今天分享下”通过正则表达式检验前端表格的方法“这篇文章，文中根据实例编码详细介绍，或许对大家的编程之路有着一定的参考空间与使用价值，需要的朋友接下来跟着云南仟龙Mark一起学习一下吧。下面给大家分享HTML用正则表达式检验表格的实例代码，具体代码内容如下所示：<span style="font-size:24px;color:#cc6600;“> 正则表达式在JavaScript脚本中是很好用的检验语法规则的方法。但是与Java中的正则表达式有所不
复制链接

扫一扫