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;
     }

　　最后效果显示：

　　

　　虽然已经触发了课程代码文本框来进行了验证，但是如果用户不看提示框，仍旧一意孤行，也不是办法，所以后台仍要对应的判断。具体后台怎么进行判断，请看下篇博客分析。