表单验证,js表单验证
表单验证怎么做?
表单验证是javascript中的高级选项之一。JavaScript 可用来在数据被送往服务器前对?HTML?表单中的这些输入数据进行验证。
举例如下：
#frm span {
? ?display: none;
? ?color: #FF0000;
}
var st=false;
function chkname(o){
? st=/^[\u4e00-\u9fa5]{2,4}$/gi.test(o.value);
? o.nextSibling.innerHTML='姓名应为2-4个汉字';
? o.nextSibling.style.display=(st?'none':'inline');
}
function chkqq(o){
? st=/^\d{5,11}$/gi.test(o.value);
? if(!st){
? ? ?o.nextSibling.innerHTML=(o.value==''?'请输入QQ号':'QQ号应为5-11位数字');
? ? ?o.nextSibling.style.display='inline';
? ? ?return;
? }
? else o.nextSibling.style.display='none';
}
// ....
function chkfrm(f){
? chkname(f.name);
? chkqq(f.qq);
? chkmail(f.mail);
? chktel(f.tel);
? chktext(f.text);
? return st;
}
什么是表单验证，它的作用是什么
表单验证是javascript中的高级选项之一。JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。
表单验证的作用：
下面的函数用来检查用户是否已填写表单中的必填（或必选）项目。假如必填或必选项为空，那么警告框会弹出，并且函数的返回值为 false，否则函数的返回值则为 true（意味着数据没有问题）：
function validate_required(field, alerttxt)
{ with(field)
{ if (value == null || value == "")
{ alert(alerttxt); return false; }
else { return true; } } }
下面是连同 HTML 表单的代码：
html head script type="text/javascript" function validate_required(field, alerttxt) { with(field) { if (value == null || value == "") { alert(alerttxt); return false; } else { return true; } } } function validate_form(thisform) { with(thisform) { if (validate_required(email, "Email must be filled out!") == false) { email.focus(); return false; } } } /script /head body form action="submitpage.htm" onsubmit="return validate_form(this)" method="post" Email: input type="text" name="email" size="30" input type="submit" value="Submit" /form /body /html
HTML5中表单验证的好处
HTML5中表单验证有如下好处：
1、可判断用户是否已填写表单中的必填项目。
2、可判断用户输入的邮件地址是否合法。
3、可判断用户是否已输入合法的日期。
4、可判断用户是否在数据域(numeric field)中输入了文本。
表单验证通常采用策略模式的思想，把一个个验证规则封装成一个函数，比如非空规则、最大长度规则等，不同的输入框选择某一个或者某几个规则进行验证。
扩展资料：
HTML表单一直都是Web的核心技术之一，有了它才能在Web上进行各种各样的应用。HTML5 Forms新增了许多新控件及其API，方便做更复杂的应用，而不用借助其它Javascript框架。
表单有以下几个基本知识点：
1、表单仍是以form元素作为容器，可在其中设置基本的提交特性。
2、当用户提交页面时，表单仍然向服务器发送表单控件的值。
3、之前老版本中的表单控件，如text radio checkbox等等，都可以按原有方式使用，尽管增加了新的功能。
4、仍然可以使用javascript操作表单控件。