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>