jquery動態生成SKU表格

sku的概念

SKU=Stock Keeping Unit（庫存量單位）。即庫存進出計量的基本單元，能夠是以件，盒，托盤等爲單位。SKU這是對於大型連鎖超市DC（配送中心）物流管理的一個必要的方法。如今已經被引伸爲產品統一編號的簡稱，每種產品均對應有惟一的SKU號。單品：對一種商品而言，當其品牌、型號、配置、等級、花色、包裝容量、單位、生產日期、保質期、用途、價格、產地等屬性中任一屬性與其餘商品存在不一樣時，可稱爲一個單品。--百度百科

以前要作一個自定義sku屬性並動態生成SKU表格,而後在網上找了一個相似的
http://www.internetke.com/jsE...
進行學習最後作出的效果以下

1. 須要自定義SKU屬性，可自定義SKU有兩個緯度：例如顏色和規格，以下圖所示
2. 添加SKU屬性後，自動生成SKU表格，須要填寫表格中每一個SKU對應的庫存、圖片、價格

實現方法：根據輸入的屬性值生成數組，此數組爲多維數組。對數組進行排列組合，造成新的數組。而後進行表格的生成，以後合併相同列。

var step = {
        //SKU信息組合
        Creat_Table: function () {
            
        },//合併行
        hebingFunction: function () {
           
        },
        //組合數組
        doExchange: function (doubleArrays,propvalidArr) {           
    }
    return step;
})

獲取全部失去焦點的input，造成屬性數組

var SKUObj = $(".attribute .Father_Title");//獲取全部的屬性
var arrayTile = new Array();//存放全部的屬性
var arrayInfo = new Array();//存放全部的屬性值
var arrayColumn = new Array();//指定列，用來合併哪些列
var propvalidArr = [];//記錄SKU值主鍵
var columnIndex = 0;
$.each(SKUObj, function (i, item){
    if ($(item).find("input[type='text']").val() != ""){
        var itemName = $(item).parent().find(".attrValue");
        var order = [];
        var skuVal = [];
        $.each(itemName, function (index,value){
            if($(value).find("input[type='text']").val() != ""){
                order.push($(value).find("input[type='text']").val());
                var idx = $(item).attr("propid")+$(value).find("div").attr("propvalid");
                skuVal.push($(item).attr("propid")+$(value).find("div").attr("propvalid"))
            }
        });
        if(order.join()!= ""){
            arrayTile.push($(item).find("input[type='text']").val());
            arrayInfo.push(order);
            arrayColumn.push(columnIndex);
            columnIndex++;
            propvalidArr.push(skuVal);
        }
    }
});

2.arrayInfo是一個多爲數組,該數組進行排列組合，就是尋找出全部的組合的可能性

1.[  
      ["白色", "紅色"],
    ]
    
     排列組合成爲：   
    [  
      ["白色"],
      ["紅色"],
    ]

2.[  
      ["白色", "紅色"],
      ["200", "300"],
    ]
    排列組合成爲：
    [  
      ["白色", "200"],
      ["白色", "300"],
      ["紅色", "200"],
      ["紅色", "300"],
    ]

實現代碼:
    doExchange: function (doubleArrays,propvalidArr) {
        var len = doubleArrays.length;
        if (len >= 2) {
            var arr1 = doubleArrays[0], propArr1 = propvalidArr[0];
            var arr2 = doubleArrays[1], propArr2 = propvalidArr[1];
            var len1 = doubleArrays[0].length, propLen1 = propvalidArr.length;
            var len2 = doubleArrays[1].length, propLen2 = propvalidArr.length;
            var newlen = len1 * len2, propnewlen = propLen1 * propLen2;
            var temp = new Array(newlen), proptemp = new Array(propnewlen);
            var index = 0;
            for (var i = 0; i < len1; i++) {
                for (var j = 0; j < len2; j++) {
                    temp[index] = arr1[i] + "," + arr2[j];
                    proptemp[index] = propArr1[i] + "," + propArr2[j];
                    index++;
                }
            }
            var newArray = new Array(len - 1);
            var propnewArray = new Array(len - 1);
            newArray[0] = temp, propnewArray[0] = proptemp;
            if (len > 2) {
                var _count = 1;
                for (var i = 2; i < len; i++) {
                    newArray[_count] = doubleArrays[i];
                    propnewArray[_count] = propvalidArr[i];
                    _count++;
                }
            }
            return step.doExchange(newArray,propnewArray);

        }
        else {
            var propArr = [];
            propArr.push(doubleArrays[0]);
            propArr.push(propvalidArr[0]);
            return propArr;
        }
    }