jquery表单验证插件与使用方法

网页特效">
(function($) {
    /*
    validation singleton
    */
    var validation = function() {
       
        var rules = {
           
            email : {
               check: function(value) {
                  
                   if(value)
                       return testpattern(value,"[w-]+(.[w-]+)*@([w-]+.)+[a-za-z]+");
                   return true;
               },
               msg : "enter a valid e-mail address."
            },
            url : {

               check : function(value) {

                   if(value)
                       return testpattern(value,"https教程?://(.+.)+.{2,4}(/.*)?");
                   return true;
               },
               msg : "enter a valid url."
            },
            required : {
               
               check: function(value) {

                   if(value)
                       return true;
                   else
                       return false;
               },
               msg : "this field is required."
            }
        }
        var testpattern = function(value, pattern) {

            var regexp = new regexp("^"+pattern+"$","");
            return regexp.test(value);
        }
        return {
           
            addrule : function(name, rule) {

                rules[name] = rule;
            },
            getrule : function(name) {

                return rules[name];
            }
        }
    }
   
    /*
    form factory
    */
    var form = function(form) {
       
        var fields = [];
   
        form.find("[validation]").each(function() {
            var field = $(this);
            if(field.attr('validation') !== undefined) {
                fields.push(new field(field));
            }
        });
        this.fields = fields;
    }
    form.prototype = {
        validate : function() {

            for(field in this.fields) {
               
                this.fields[field].validate();
            }
        },
        isvalid : function() {
           
            for(field in this.fields) {
               
                if(!this.fields[field].valid) {
           
                    this.fields[field].field.focus();
                    return false;
                }
            }
            return true;
        }
    }
   
    /*
    field factory
    */
    var field = function(field) {

        this.field = field;
        this.valid = false;
        this.attach("change");
    }
    field.prototype = {
       
        attach : function(event) {
       
            var obj = this;
            if(event == "change") {
                obj.field.bind("change",function() {
                    return obj.validate();
                });
            }
            if(event == "keyup") {
                obj.field.bind("keyup",function(e) {
                    return obj.validate();
                });
            }
        },
        validate : function() {
           
            var obj = this,
                field = obj.field,
                errorclass = "errorlist",
                errorlist = $(document.createelement("ul")).addclass(errorclass),
                types = field.attr("validation").split(" "),
                container = field.parent(),
                errors = [];
           
            field.next(".errorlist").remove();
            for (var type in types) {

                var rule = $.validation.getrule(types[type]);
                if(!rule.check(field.val())) {

                    container.addclass("error");
                    errors.push(rule.msg);
                }
            }
            if(errors.length) {

                obj.field.unbind("keyup")
                obj.attach("keyup");
                field.after(errorlist.empty());
                for(error in errors) {
               
                    errorlist.append("

"+ errors[error] +"

");       
                }
                obj.valid = false;
            }
            else {
                errorlist.remove();
                container.removeclass("error");
                obj.valid = true;
            }
        }
    }
   
    /*
    validation extends jquery prototype
    */
    $.extend($.fn, {
       
        validation : function() {
           
            var validator = new form($(this));
            $.data($(this)[0], 'validator', validator);
           
            $(this).bind("submit", function(e) {
                validator.validate();
                if(!validator.isvalid()) {
                    e.preventdefault();
                }
            });
        },
        validate : function() {
           
            var validator = $.data($(this)[0], 'validator');
            validator.validate();
            return validator.isvalid();
           
        }
    });
    $.validation = new validation();
})(jquery);

                   

                       

test fields

                       

                            required field
                           
                       

                       

                            email field
                           
                       

                       

                            url field