Home > Web Front-end > JS Tutorial > FormValidate form validation function code updated and available for download_javascript skills

FormValidate form validation function code updated and available for download_javascript skills

WBOY
Release: 2016-05-16 19:01:50
Original
1293 people have browsed it

FormValidate function update

Download:
http://xiazai.jb51.net/jslib/FormValidate.rar

For more usage, please refer to:

http ://jobj.googlecode.com/svn/trunk/FormValidate/demo.html

Add method:
extend,
Add verification mode 4, the same as 3, but when the verification fails, Stop checking downward immediately. In mode 3, if an error occurs, the error will be recorded and checked downward. In mode 4, there will be no downward check.


Usage:




. . . . .
. . . . .
var checkRule = [
{name:"name[0]", required:true, min:2, max:3, msg:"Please enter your name! The length must be greater than 2 and less than 3"},
{name:"birthday[0]",required:false, type:"Date", msg:"Date of birth is optional, if entered, please enter the correct date"},
{name:"email [0]", required:false, type:"Email", msg:"Email is optional, if entered, please enter the correct email address"},
{name:"scoreA[0]", required: true, type: "Num", min:0, max:100, msg: "Chinese score is a must, it must be greater than 0 and less than 100"},
{name:"scoreB[0]", required:true, type:"Num", min:0, max:100, msg:"Mathematical scores are required and must be greater than 0 and less than 100"},
{name:"scoreC[0]", required:true, type: "Num", min:0, max:100, msg:"English score is required and must be greater than 0 and less than 100"}
];

JObj.plugin("FormValidate");
var va = JObj.Plugin.FormValidate;

va.extend(document.forms[0],"ruleTpl",checkRule);
return va.validate(document.forms[0],checkRule ,4);

Explanation:
Why is it written like this?
If you do not want to add form items dynamically, you can delete the sentence va.extend. But if you add form items dynamically. . . New form items cannot be specified.
Written like this, it is the verification rule specified by ruleTpl. This ruleTpl can be any string (not its value). For example, if ruleTpl is replaced by ttt, then it must be written as:
va.extend(document.forms[0],'ttt',checkRule)
ruleTpl exists as a custom attribute of the form item, and its value must be a subscript of checkRule. If this subscript does not exist, this item will not be checked by default. Otherwise, copy the selected checkRule element to achieve the purpose of dynamically adding verification rules.

When adding this function, I encountered several interesting problems. Let me talk about them below:

1. Address reference, please do not run it. Tell me the value of variable a in the following code. value.

var a = [{name:1}];
var tmp = a.push(a[a.length - 1]);
a[tmp - 1].name = 2 ;
If you say: a = [{name:1},{name:2}], then you are totally wrong. The real value is:
a = [{name:2},{ name:2}];

The reason is very simple, because what is pushed is an object, and the object is an address reference in JS. Therefore, when a[tmp - 1].name = 2, it actually changes a The value of [0] has changed.

The following paragraph is very simple, value reference, the above situation will not happen.


var a = [1,2,3];
a.push(a[a.length - 1]);
alert(a);
a[ a.length - 1] = 4;
alert(a);
2, dynamically delete form items in FF.
If a form item is deleted dynamically, without alert, form['itemName'] will still be the deleted form item.
At this time, its parentNode and form are both null, but it cannot be judged by parentNode == null. I don’t know why, FF is really confusing. In order to complete the function, I have to use item.form == To judge by null, such as:

if (obj == undefined || obj.form == null) return null;

IE does not have this problem.

Related labels:
js
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template