JS 实现一个实时动态校验，将输入格式错误的显示为红色背景

---

---

功能描述：

实时动态校验，如果输入的格式错误，将弹窗提示输入格式错误并将背景展示为红色。

源码：

前台：

<hy:formfield name="cxfdl" onblur="test2('XXXXXXXX','cxfdl')" title="XXXXXXXX"   />
<hy:formfield name="pjyjd" onblur="test2('title','pjyjd')" title="title" />

JS：
保存方法：

//保存
    function save(){
        var msg = "";
        // 遍历单个校验时不通过的键值对集合，拼接错误信息
        $.each(notPassArray, function(key){
            msg = msg + notPassArray[key] + "</br>";
        });
        // 错误信息不为空时，弹出错误信息，并取消保存处理
        if (msg != "") {
            $.alert('提示信息', msg, function(){});
            return;
        }
        var formData = ajaxform.collectData() ;
        var dataArr = [] ;
        dataArr.push(formData) ;
        $.request({
            action:"save",
            data:dataArr,
            success:onsavecomplete
        }) ;
    }

    //用来存储校验不通过的信息
    var notPassArray = {} ;

    //正则整数校验
    function test1(title, column){
        var columnObj = ajaxform.getColumnComponent(column);
        var patrn = /^[0-9]*$/;  
        var columnValue = ajaxform.getColumnValue(column);
        if (columnValue!=null && columnValue!="" && !patrn.test(columnValue)) {
            notPassMsg = title + '只能为整数';
            notPassArray[column]=notPassMsg;
            columnObj.css({"background-color":"#FDC8CC"});
            $.alert('提示信息', notPassMsg, function(){});
        } else {
            delete notPassArray[column];
            columnObj.css({"background-color":""});
        }
    }

//校验带小数的数字
    function test2(title, column){
        // 根据column获得对应的jquery对象
        var columnObj = ajaxform.getColumnComponent(column);
        var patrn = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
        // 根据传进来的column获得填写的内容
        var columnValue = ajaxform.getColumnValue(column);
         if (columnValue!=null && columnValue!="" && !patrn.test(columnValue)) {  
            // 拼接错误信息
            notPassMsg = title + '：只能输入小数点后两位的数字';
            // 将错误信息保存到键值对的集合中
            notPassArray[column]=notPassMsg;
            // 设置校验不通过的背景颜色
            columnObj.css({"background-color":"#FDC8CC"});
            $.alert('提示信息', notPassMsg, function(){});
         } else {
            // 校验通过后删除键值对中的错误信息
            delete notPassArray[column];
            // 校验通过后去掉背景颜色
            columnObj.css({"background-color":""});
         }
    }