js&&html校验组件（非空，格式等）

//校验器（校验器还可以继续扩充，实现各种格式的校验,在此只是举例）

var validator = {

 required : function(el) {

    if(!el.value || Trim(el.value)==''){

        alert("校验非空");

        el.value='';

        var msg=$(el).attr('validate-msg');//提示信息可以自行修改

        $(el).next('.validate')[0].innerHTML="<div class='validate-error'>"+(!msg?'':msg)+"</div>";

        return false;

    }else{

        $(el).next('.validate')[0].innerHTML="";

        return true;

    }

 },

 email : function(el){

     //这里进行email格式的校验

     alert("校验email格式！");

 }

};

function addValidate() {

    $("[validate]").blur(function() {

         var type = $(this).attr('validate');

         if(type.indexOf("required")>=0){

             var iFlag=validator["required"](this);

             if(!iFlag){

                  return false;

             }

         }

        if(type.indexOf("email")>=0){

             var iFlag=validator["email"](this);

             if(!iFlag){

                return false;

             }

        }

    });

}

window.onload = function() {

       addValidate();

};

<input type='text'  id="email" name="email" class="input_solid" validate='required;email' validate-msg='email不能为空' style="height:20px;line-height:20px;width:450px"/><span class='validate'></span>