文本框光標離開事件:onBlur

在輸入完成qq號碼、微信號碼、email、手機號的時候,就去校驗,利用文本框的 光標離開事件:onBlur ,在這個事件裏寫校驗重複的程序,把並加入本聯繫人的id,如果重複,在文本框下面,或者後面用紅色字體提示 重複等 信息。
而且不阻止用戶的保存聯繫人信息。

//首先用正則表達式判斷是否合法,然後,通過Ajax,調用對應的//url,即對應的action的方法,實現數據的前後臺的異步交互。根據//返回的msg來進行判斷。
function isEmail(str){
           var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
           var email=document.getElementById("contact_email").value;
           var id=document.getElementById("contact_id").value;
           var url="${ctx}/crm/contact.action?method:checkForm";
           $.ajax({
                url : url,
                async:false,
                type : "post",
                dataType : "json",
                data : {
                        id:id,
                        email:email
                    },
                success : function(data) {
                    pass=data.pass;
                    msg=data.msg;
                }
          });
           if(reg.test(str)=== false){
               document.getElementById("txtHint").innerHTML="輸入不合法";   
           }else if(msg!=null){
               document.getElementById("txtHint").innerHTML=""+msg;
           }else{
               document.getElementById("txtHint").innerHTML="";
           }
    }
    function isQQ(str){
           var reg=/^\d{5,10}$/;  
           var qq=document.getElementById("contact_QQ").value;
           var id=document.getElementById("contact_id").value;
           var url="${ctx}/crm/contact.action?method:checkForm";
           $.ajax({
                url : url,
                async:false,
                type : "post",
                dataType : "json",
                data : {
                        id:id,
                        QQ:qq
                    },
                success : function(data) {
                    pass=data.pass;
                    msg=data.msg;
                }
          });
           if(reg.test(str)=== false){
               document.getElementById("QQHint").innerHTML="輸入不合法";   
           }else if(msg!=null){
               document.getElementById("QQHint").innerHTML=""+msg;
           }else{
               document.getElementById("QQHint").innerHTML="";
           }

    }
    function isPhoneNumber(str){
        var reg=/^1[3|4|5|7|8]\d{9}$/;
        var mobile=document.getElementById("contact_mobile").value;
         var id=document.getElementById("contact_id").value;
        var url="${ctx}/crm/contact.action?method:checkForm";
           $.ajax({
                url : url,
                async:false,
                type : "post",
                dataType : "json",
                data : {
                        id:id,
                        mobile:mobile
                    },
                success : function(data) {
                    pass=data.pass;
                    msg=data.msg;
                }
          });
           if(reg.test(str)=== false){
               document.getElementById("pnHint").innerHTML="輸入不合法";   
           }else if(msg!=null){
               document.getElementById("pnHint").innerHTML=""+msg;
           }else{
               document.getElementById("pnHint").innerHTML="";
           }

    }
<div class="row">
                <label class="col-sm-1 control-label no-padding-right"
                    for="contact_mobile">手機:</label>
                <div class="col-sm-5">
                    <input type="text" name="contact.mobile" id="contact_mobile" value="${contact.mobile}" class="input-large" οnblur="isPhoneNumber(this.value)"/>
                    <font id="pnHint" color="#FF0000"></font>               
                </div>

                <label class="col-sm-1 control-label no-padding-right"
                    for="contact_email">郵箱:</label>
                <div class="col-sm-5">
                    <input type="text" name="contact.email" id="contact_email" value="${contact.email}" class="input-large" οnblur="isEmail(this.value)"/>
                    <font id="txtHint" color="#FF0000"></font>
                </div>
            </div>
            <label class="col-sm-1 control-label no-padding-right"
                    for="contact_QQ">QQ:</label>
                <div class="col-sm-3">
                    <input type="text" name="contact.QQ" id="contact_QQ" value="${contact.QQ}" class="input-large" οnblur="isQQ(this.value)"/>
                    <font id="QQHint" color="#FF0000"></font>
                </div>
//對應的action的方法。
//判斷String 不爲空的方法,先判斷不爲null再判斷是否equals ""   :   (!(QQ ==null || QQ.equals(""))

public void checkForm(){
        String mobile=(String)getParameter("mobile", String.class);
        String email=(String)getParameter("email", String.class);
        String QQ=(String)getParameter("QQ", String.class);
        Long id=(Long)getParameter("id",Long.class);
        System.out.println("id: "+id);
        boolean pass=true;
        String mobileSql="SELECT * FROM t_contact c WHERE c.f_mobile=? AND c.f_id!=?";
        List mobileList = manager.findByNativeSqlAsMap(mobileSql, new Object[]{mobile,id});

        String emailSql="SELECT * FROM t_contact c WHERE c.f_email=? AND c.f_id!=? ";       
        List emailList = manager.findByNativeSqlAsMap(emailSql, new Object[]{email,id});

        String qqSql="SELECT * FROM t_contact c WHERE c.f_qq=? AND c.f_id!=? ";
        List qqList = manager.findByNativeSqlAsMap(qqSql, new Object[]{QQ,id});
        //mobile不爲空且size不爲0,即有重複
        if((!(mobile ==null || mobile.equals("")))&& mobileList.size()!=0){
            pass=false;
            msg+="手機號:"+mobile+ "  重複   ";          
        }
        if((!(email ==null || email.equals(""))) && emailList.size()!=0){
            pass=false;
            msg+="email:"+email+"  重複   ";          
        }
        if((!(QQ ==null || QQ.equals(""))) && qqList.size()!=0){
            pass=false;
            msg+="qq號:"+QQ+"  重複  ";    
        }
        JSONObject resultObject = new JSONObject();
        resultObject.put("pass", pass);
        if(!(msg ==null || msg.equals(""))){
            resultObject.put("msg", msg.substring(4));
        }else{
            resultObject.put("msg", msg);
        }

        System.out.println("==========");
        System.out.println("pass"+pass);
        System.out.println(resultObject.toString());
        responseWrite(resultObject.toString());
    }
發佈了83 篇原創文章 · 獲贊 9 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章