JS常用表单验证方法总结

2024-07-28 15:27:04

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>表单验证</title>
<script language="javascript">
function check_1(param){//不为空
if(param==""||param==null){return false;}else{return true;}
}
function check_2(param){//长度限制,字母是10个，汉字也是10个
if(param.length>10){return false;}else{return true;}
}
function check_3(param){//只能输入汉字
var pattern= /^[\u4e00-\u9faf]+$/;
var flag = pattern.test(param);
if(flag==false){return false;}else{return true;}
}
function check_4(param){//只能输入数字
var pattern= /^[0-9]+$/;
var flag = pattern.test(param);
if(flag==false){return false;}else{return true;}
}
function check_5(param){//只能输入数字字母下划线
var pattern= /^[0-9a-zA-z_]+$/;
var flag = pattern.test(param);
if(flag==false){return false;}else{return true;}
}
function check_6(param){//邮箱格式验证
var pattern= /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
var flag = pattern.test(param);
if(flag==false){return false;}else{return true;}
}
function check_7(param){//网址格式验证
var pattern= /^((https|http|ftp|rtsp|mms)?:\/\/)?(([0-9a-z_!~*'().&=+$%-]+: )?[0-9a-z_!~*'().&=+$%-]+@)?(([0-9]{1,3}\.){3}[0-9]{1,3}|([0-9a-z_!~*'()-]+\.)*([0-9a-z][0-9a-z-]{0,61})?[0-9a-z]\.[a-z]{2,6})(:[0-9]{1,4})?((\/?)|(\/[0-9a-z_!~*'().;?:@&=+$,%#-]+)+\/?)$/;
var flag = pattern.test(param);
if(flag==false){return false;}else{return true;}
}
function check(){
var value=document.getElementById("testValue").value;
var result=check_7(value);//在这里设置验证函数的名称，我写了check_1~check_7七个常用的表单验证函数
if(result==false){
document.getElementById("testValue").style.border="2px solid red";
}else{
//document.getElementById("testValue").style.border="2px solid green";
document.getElementById("testValue").style.border="";
}
}
</script>
</head>
<body>
<div style="text-align: center;padding: 200px 0;">
请输入： <input id="testValue" name="" class="" type="text" style="width:200px;height:30px;"></input>
<input id="" name="" class="" type="button" value="点击验证" style="width:70px;height:30px;" onclick="check()"></input>
</div>
</body>
</html>

js 表单验证方法(实用)

//下面验证的是长度 function checkTextLen(textId){ var len = 0; var checkField=document.getElementById(textId); var inputstring = checkField.value; var string_length = inputstring.length; if (string_length == 0) { return 0; } for (var i=0;i<string_length;i++)
在表单提交前进行验证的几种方式整理

在表单提交前进行验证的几种方式 . 在Django中,为了减轻后台压力,可以利用JavaScript在表单提交前对表单数据进行验证.下面提供了有效的几种方式(每个.html文件为一种方式). formpage1.html 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional
js校验表单后提交表单的三种方法总结

第一种: 复制代码代码如下: <script type="text/javascript"> function check(form) { if(form.userId.value=='') { alert("请输入用户帐号!"); form.userId.focus(); return false; } if(fo
利用JS提交表单的几种方法和验证(必看篇)

工作中发现表单提交方便的问题,很多时候IE下提交好好的,打了火狐下就出现了问题,利用提交按钮就不成功了,于是利用JS的方式就成功了,也不知道为什么.在导师的催促下就总结出以下的几种常用表单提交的方法. 第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 <script type="text/javascript"> function validate(obj) { if (confirm("提交表单?")) { aler
手把手教你自己写一个js表单验证框架的方法

在表单程序中,在页面上需要很多的Js代码来验证表单,每一个field是否必须填写,是否只能是数字,是否需要ajax到远程验证,blablabla. 如果一个一个单独写势必非常的繁琐,所以我们的第一个目标就是构建一个类似DSL的东西, 用表述的语句而非控制语句来实现验证. 其次一个个单独写的话还有一个问题就是必须全部验证通过才能提交,但是单独验证会因为这个特征而增加很多额外的控制代码,且经常会验证不全面.所以第二个目标就是能够全面的整合整个验证的过程. 最后不能是一个无法扩展的一切写死的实现
js验证表单大全

不错的JS验证~~~~~~~~~~~~~~~~~~~~~~~~~ 用途:校验ip地址的格式输入:strIP:ip地址返回:如果通过验证返回true,否则返回false: */ function isIP(strIP) { if (isNull(strIP)) return false; var re=/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/g //匹配IP地址的正则表达式 if(re.test(strIP)) { if( RegExp.$1 <256 && R
JS常用表单验证方法总结

复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"
JS表单验证方法实例小结【电话、身份证号、Email、中文、特殊字符、身份证号等】

本文实例总结了JS表单验证方法.分享给大家供大家参考,具体如下: 回回写表单,回回要写不同的检查JS,很麻烦,后来写了通用的检查函数,很粗糙,但比较实用,以后再好好改改: 包含页: Check-Form.js 代码如下: //规则检查排序 function RegCheck(objs) { var str = objs.checktype; switch (str) { case "cn" : //要检查的表单控件的输入类型必须为中文 return CnWordRegCheck(obj
纯JS实现表单验证实例

表单我实现了,input属性是text(文本框).radio(单选按钮).checkbox(多选按钮)的知识点, fieldset标签(组合表单中的相关元素).select标签(选择列表)和textarea标签(多行文本框). <form action="MAILTO:someone@w3school.com.cn" method="post" enctype="text/plain" onsubmit="return check
php常用表单验证类用法实例

本文实例讲述了php常用表单验证类用法.分享给大家供大家参考.具体如下: <?php /** * 页面作用:常用表单验证类 * 作者:欣然随风 * QQ:276624915 */ class class_post { //验证是否为指定长度的字母/数字组合 function fun_text1($num1,$num2,$str) { Return (preg_match("/^[a-zA-Z0-9]{".$num1.",".$num2."}$/&q
js进行表单验证实例分析

本文实例讲述了js进行表单验证的方法.分享给大家供大家参考.具体实现方法如下: 1. 传统的表单验证代码复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/199
常用表单验证类，有了这个，一般的验证就都齐了。

复制代码代码如下: <?php /** * 页面作用:常用表单验证类 * 作者:欣然随风 * 建立时间:2006-3-6 * QQ:276624915 */ class class_post { //验证是否为指定长度的字母/数字组合 function fun_text1($num1,$num2,$str) { Return (preg_match("/^[a-zA-Z0-9]{".$num1.&q
CodeIgniter表单验证方法实例详解

本文实例讲述了CodeIgniter表单验证方法.分享给大家供大家参考,具体如下: 1.在D:\CodeIgniter\system\application\views目录下写一个视图文件myform.php <html> <head> <title>My Form</title> </head> <body> <?php echo $this->validation->error_string;?> <
JS实现表单验证功能(验证手机号是否存在，验证码倒计时)

废话不多说直接上代码 html代码: <form method="post" id="form_hroizon" enctype="multipart/form-data" action="/"> <input type="hidden" name="phoneTemplet" id="phoneTemplet"> <input type
JS简单表单验证功能完整示例

本文实例讲述了JS简单表单验证功能.分享给大家供大家参考,具体如下: 简单js表单验证demo <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
原生js 实现表单验证功能

表单验证是web前端最常见的功能之一,也属于前端开发的基本功.自己完成一个表单验证的开发,也有助于加深对字符串处理和正则表达式的理解. 基本的表单验证包括如:字母验证.数字验证.字母和数字验证.汉字验证.密码验证.日期验证.手机验证.邮箱验证,密码验证等. 现在就来完成这些验证代码的编写,先来看字母是怎么验证的.先编写需要的html代码,创建一个id为formContainer的表单元素,在里面加入需要验证英文字母的文本框和按钮,文本框后面需要一个span元素存放提示文字.如下所示: <form

JS常用表单验证方法总结

相关推荐

随机推荐