sku
/
index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery.min.js"></script>
    <script src="sku.js"></script>
    <style>
        .btn{
            padding: 1px 6px;
            background: gainsboro;
            cursor: pointer;
            margin: 3px;
        }

        .none{
            display: none;
        }
    </style>

<!--    优化代码， 封装成3个函数， 然后 在extend 给 jq-->

<!--    数据会滚后id 会滚 -->
</head>
<body>
<div id="box">
    <span class="btn get none">获取</span>
    <span class="btn set none">设置</span>

    <input type="text" id="attr" placeholder="请输入规格"> <span class="btn" onclick="sku.addAttr()">添加</span>

    <div class="items" style="width: 100%">

    </div>

    <hr>

    <div class="table">
        <table border="1" id="table">
            <tr id="tableHeader">

            </tr>
        </table>
    </div>
</div>
</body>

<script>

    var set_items = [
        ["红", "大", 0,"10",0, 0,1],
        ["红", "中", 0, 0, 0 , 0,2],
        ["红", "小", 0, 0, 0, 0,3],
        ["绿", "大", 0, 0, 0, 0,4],
        ["绿", "中", 0, 0, 0, 0,5],
        ["绿", "小", 0, 0, 0, 0,6],
        ["蓝", "大", 0, 0, 0, 0,7],
        ["蓝", "中", 0, 0, 0, 0,8],
        ["蓝", "小", 0, 0, 0, 0,9]
    ];

    var set_sku = [
        {
            attr:"颜色",
            attr_values: [
                "红","绿","蓝"
            ],
            id:"1"
        },
        {
            attr:"尺码",
            attr_values: [
                "大","中","小"
            ],
            id:"2"
        },
    ];

    var sku = new Class({
        attr_length:3,  //  规格最多长度
        attr_values_length:3,    //  规格值最多多少项
        default_table_header: ["进货价","库存","卖出价格","会员价格"],    //  默认表格头部
        sku:set_sku, //  sku规格
        sku_items:set_items,   //  sku每条
        is_debug:true,   //  是否调试模式，调试模式显示获得数据按钮，可在页面点击后 console.log 看到
    });
</script>
</html>