DWZ主從表界面唯一性驗證（自寫js）（二）

　　上篇介紹了自寫js判斷的前三項，本篇博客介紹第四步，關於觸發課程代碼文本框的離開事件后，判斷一整列的課程代碼之間是否有重復的值。

　　此問題可以提取為判斷一個數組里是否有重復值，重復值是什么。

　第四步→判斷界面唯一性，獲取各行code值。

　　通過觀察，主從表下每一行的課程代碼文本框都有一個數組樣式的name屬性，如：name="courseList[#index#].code" 

　　查看代碼可知，每一行的課程代碼都有不同的name，那么怎么獲取這些不同name的對象數組呢？

　　

　　通過反復試驗，我最后得出一種方法，步驟是：先獲得主從表內所有標簽為<input>的對象，然后通過獲取他們的name屬性的值，來匹配。

　　具體匹配方法就是觀察各個name之間的不同。

　　課程代碼對應的name類型為：name="courseList[#index#].code" 

　　課程名稱對應的name類型為：name="courseList[#index#].name" 

　　所以，通過觀察，只要匹配code字符串就可以獲取到一列的課程代碼的對象數組了。

　　拿到這個數組，就開始遍歷，是否數組內有重復值，如果有重復值，就把它放在第三方的數組里，最后彈出框里顯示這些重復值。

　　具體的js代碼如下：

　　

  //4、判斷界面唯一性，獲取各行code值
   
            //4.1獲得code列
                     //4.11獲得表格
        var table = document.all("parentTable");
                    //4.12獲得表格下的所有文本框
        var input=table.getElementsByTagName("input");
                    //4.13定義一個空數組來裝得到的code列
        var resultCodeString=[];
                   //4.14循環遍歷出code列，並將code文本框的值放到定義的空數組resultCodeString中
            for(i=0;i<input.length;i++){
                //利用lastIndexOf來匹配，如果有code字符串則返回大於-1的值，
                if(input[i].name.lastIndexOf("code")>-1){
                    //alert(input[i].value);
                    //如果name中匹配到了code，則將這個文本框的值放到我們的code數組里。
                    resultCodeString[resultCodeString.length] =input[i].value;
                    
                }
            }
                   //測試數組容器的長度
            //alert(resultCodeString.length);
            //定義一個第三方數組，來裝重復值
            var showMessage=[];
            //遍歷得到的code數組容器
            for(i=0;i<resultCodeString.length;i++){
                //測試是否是code列中的值
                //alert(resultCodeString[i]);
                //以下為判斷是否重復的方法，並將重復值放在數組里。
                //先排序
                var resultCode=resultCodeString.sort();
                 for(var i=0;i<resultCodeString.length;i++){
                     if(resultCodeString[i] != ""){
                         if (resultCode[i]==resultCode[i+1]){
                             showMessage[showMessage.length] =resultCode[i];
                             }
                     }
                
                }
                // alert(showMessage.length);
                 // alert("數組重復內容為："+showMessage[i]);
                 
                 //因為我們得到的重復數據會有重復的，所以需要數組去重，這里調用了unique方法，具體實現見下面的代碼
                 var arr=showMessage.unique();
                 if(arr!=""){
                    // alert("課程代碼有重復，重復值為"+arr);
                     alertMsg.warn( "課程代碼有重復，重復值為"+arr);
                 }
                    
            }

 

　　JS實現得數組去重的三種方法：借鑒於《三種常用的js數組去重方法》

　　

/* 第一種去重的方法 */
 /* Array.prototype.unique = function(){
        var res = [this[0]];
        for(var i = 1; i < this.length; i++){
            var repeat = false;
            for(var j = 0; j < res.length; j++){
                if(this[i] == res[j]){
                    repeat = true;
                    break;
                }
            }
            if(!repeat){
                res.push(this[i]);
            }
        }
        return res;
    } */
    /* 第二種去重的方法 */
/*     Array.prototype.unique = function(){
    this.sort();    //先排序
    var res = [this[0]];
    for(var i = 1; i < this.length; i++){
        if(this[i] !== res[res.length - 1]){
            res.push(this[i]);
        }
    }
    return res;
} */
    /* 第三種去重的方法 */
    Array.prototype.unique = function(){
        var res = [];
        var json = {};
        for(var i = 0; i < this.length; i++){
            if(!json[this[i]]){
                res.push(this[i]);
                json[this[i]] = 1;
            }
        }
        return res;
    }

　　最后效果顯示：

　　

　　雖然已經觸發了課程代碼文本框來進行了驗證，但是如果用戶不看提示框，仍舊一意孤行，也不是辦法，所以后台仍要對應的判斷。具體后台怎么進行判斷，請看下篇博客分析。