SOURCE

$(function(){
    $(".ui.dropdown").dropdown();

   
    $(".PCBChoosePart"+"Item").click(function(){
        alert(123);

    });

});

var FixItemArr=["PCBChoose","FixRebind","MaterInput"];
function ChangeItem(str){
    for(s in FixItemArr)
    {
        $("." + FixItemArr[s] + "Item").attr("class","item "+FixItemArr[s]+"Item");
        $("#" + FixItemArr[s] + "Part").hide();
    }
    $("." + str + "Item").attr("class","active item "+str+"Item");
    $("#" + str + "Part").show();
}

var CheckMap={};

function SelectAllClick(){
    CheckMap['SelectAll'] = $("#SelectAll").prop("checked");
    CheckMap['SelectAll1'] = true;
    alert(CheckMap);

    //var b = $("#SelectAll").prop("checked");
    //$("#SelectAll").prop("checked",!b);
    //alert($("#SelectAll").prop("checked"));
}

CheckJson = {};
CheckMap[1] = $("#1").prop("checked");
$("#1").click(function () { 
    CheckMap[1] = !$("#1").prop("checked");});

    function abc(){
        for (checkedid in CheckMap) {
            if(CheckMap[checkedid])
            alert(CheckMap[checkedid]);
        }
    }

<table style="width:100%">
    <tr>
        <td>
            <div class="flu ui visible message" style="width:100%;">
                <div class="fluItem"><label style="line-height:30px">订单状态:</label><select class="ui dropdown orderStatus" onchange="orderStatusChanged()">
                    @*<option value='0'>全部订单</option>
                     <option value='未上线'>未上线</option>
                     <option value='正在生产' selected = 'selected' >正在生产</option>
                     <option value='已完成'>已完成</option>*@
                     </select></div>
                <div class="fluItem orderChooseDiv"><label>订单:</label><select class="ui search dropdown orderChoose" onchange="orderChanged()"><option value='0'>请选择订单</option></select></div>
            </div>
        </td>
    </tr>
    <tr>
        <td>
            <div class="ui segment">
                <div class="ui secondary pointing menu">
                <a class="active item MaterInputItem" onclick="ChangeItem('MaterInput')">
                    物料录入
                </a>
                <a class="item PCBChooseItem" onclick="ChangeItem('PCBChoose')">
                    PCB选择
                </a>
                <a class="item FixRebindItem" onclick="ChangeItem('FixRebind')">
                    返修重绑
                    </a>
                </div>
                
                <div id="MaterInputPart">
                    <div class="ui icon fluid input">
                        <input type="text" placeholder="扫描二维码" id="scanBox" />
                        <i class="qrcode big icon"></i>
                    </div>
                    <div class="ui grid">
                        <div class="five wide column">
                            <table>
                                <tr>
                                    <td>
                                        采购订单号：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" id="MaterialOrder" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        物料编码：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" id="MaterialCode" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        物料PN：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" id="MaterialPN" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Date Code：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" id="DateCode" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        Lot NO：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" id="LotNO" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        数量：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" id="TotalNum" required/>
                                        </div>
                                    </td>
                                </tr>
                            </table>                            
                        </div>
                        <div class="five wide column">
                            <table>
                                <tr>
                                    <td>物料生产编号：</td>
                                    <td><div class="ui small input">
                                            <input type="text" id="MaterialProductSN" name="trial"/>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>物料型号：</td>
                                    <td><div class="ui small input">
                                            <input type="text" id="MaterialModel" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>物料名称：</td>
                                    <td><div class="ui small input">
                                            <input type="text" id="MaterialName" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>物料规格：</td>
                                    <td><div class="ui small input">
                                            <input type="text" id="MaterialSpec" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>物料用量：</td>
                                    <td><div class="ui small input">
                                            <input type="text" id="MaterialUseNum" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>物料ECN：</td>
                                    <td><div class="ui small input">
                                            <input type="text" id="MaterialECN" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>位号：</td>
                                    <td><div class="ui small input">
                                            <input type="text" id="MaterialPosition" name="trial" />
                                        </div>
                                    </td>
                                </tr>
                            </table>
                        </div>
                        
                        <div class="six wide column">
                            <table>
                                <tr>
                                    <td>备注：
                                    </td>
                                    <td>
                                        <form class="ui form">
                                            <div class="ui small input">
                                                <textarea type="text" id="Note" rows="4" cols="50"></textarea>
                                            </div>
                                        </form>
                                    </td>
                                </tr>
                                <tr>
                                    <td>其他信息：
                                    </td>
                                    <td>
                                        <form class="ui form">
                                            <div class="ui small input">
                                                <textarea type="text" id="OtherInfo" rows="4" cols="50"></textarea>
                                            </div>
                                        </form>
                                    </td>
                                </tr>
                                <tr>
                                    <td>模糊数量：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" value="0" id="DimRecordNum" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>Index：
                                    </td>
                                    <td>
                                        <div class="ui small input">
                                            <input type="text" value="9999" id="MaterialIndex" />
                                        </div>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div align="center" id="InputButton">
                        <button class="ui blue button" onclick="uploadmaterial()"><i class="box icon"></i>录入</button>
                    </div>
                </div>

                <div id="PCBChoosePart" hidden>
                    物料选择界面=支持手动多选&全选&筛选某个物料的datecode对应的PCB
                                <div class="ui grid">
                                    <div class="eight wide column" align="left">
                                        <div id="divPages"></div>
                                    </div>
                                    <div class="eight wide column" align="right">
                                        <div class="ui mini right action left icon input" style="height:30px;">
                                            <i class="search icon"></i>
                                            <input type="text" placeholder="搜索" id="searchBox">
                                            <div class="ui basic floating dropdown button">
                                                <div class="text" id="searchAttr" style="width:70px;">全部</div>
                                                <i class="dropdown icon"></i>
                                                <div class="menu">
                                                    <div class="item">全部</div>
                                                <div class="item">PCB ID</div>
                                                <div class="item">SN</div>
                                                <div class="item">组装临时标</div>
                                                <div class="item">Fanvil SN</div>
                                                <div class="item">MAC号</div>
                                                <div class="item">IMEI号</div>
                                                <div class="item">组装订单号</div>
                                                <div class="item">物料信息</div>
                                                <div class="item">创建时间</div>
                                                <div class="item">维修记录</div>
                                                <div class="item">其他信息</div>
                                                <div class="item">用户名</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                </div>
                                <table class="ui selectable striped table ListTable">
                                    <thead>
                                        <tr>
                                            <td align='center' valign='middle' class='hover' style="width:4%;"><div class="ui checkbox"> <input type="checkbox" id="SelectAll" onmousedown="SelectAllClick()">  <label></label></div></td>
                                            <td align='center' valign='middle' class='hover' style="width:4%;"><a onclick='sortPCB("PCBId")'>ID<i class="" id="PCBId"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:8%;"><a onclick='sortPCB("PCBSN")'>SN<i class="" id="PCBSN"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:8%;"><a onclick='sortPCB("TempSN")'>组装临时标<i class="" id="TempSN"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:8%;"><a onclick='sortPCB("FSN")'>Fanvil SN<i class="" id="FSN"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:8%;"><a onclick='sortPCB("MAC")'>MAC号<i class="" id="MAC"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:6%;"><a onclick='sortPCB("IMEI")'>IMEI号<i class="" id="IMEI"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:6%;"><a onclick='sortPCB("PackageOrder")'>组装订单号<i class="" id="PackageOrder"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:8%;"><a onclick='sortPCB("MaterialInfo")'>物料信息<i class="" id="MaterialInfo"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:10%;"><a onclick='sortPCB("Time")'>创建时间<i class="" id="Time"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:6%;"><a onclick='sortPCB("RepairRecord")'>维修记录<i class="" id="RepairRecord"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:8%;"><a onclick='sortPCB("Info")'>其他信息<i class="" id="Info"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:6%;"><a onclick='sortPCB("UserName")'>用户名<i class="" id="UserName"></i></a></td>
                                            <td align='center' valign='middle' class='hover' style="width:14%;">操作</td>
                                        </tr>
                                    </thead>
                                    <tbody id="showTable">
                                    </tbody>
                                </table>
                </div>

                <div id="FixRebindPart" hidden>
                    选择返修物料信息
                </div>
            </div>

        </td>
    </tr>
</table>


<input type='checkbox' id = '1'>  <label></label></div>
<button onclick="abc()">123</button>

.ui.vertical.sidebar {
    background-color: #444; /*425677*/
    font-size: 12px;
}

.ui.accordion {
    background-color: #444;
    font-size: 12px;
    padding: 0px;
}

    .ui.accordion p, div {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .ui.accordion div {
        margin-top: -6px;
        margin-bottom: -11px;
    }

    .ui.accordion .transition.item {
        background-color: #252525;
        font-size: 12px;
    }

.ui.inverted.borderless.attached.labeled.icon.top.menu {
    background-color: #444;
    height: 60px;
}


.ui.visible.left.sidebar ~ .fixed, .ui.visible.left.sidebar ~ .pusher {
    -webkit-transform: translate3d(154px,0,0);
    transform: translate3d(154px,0,0);
}

.ui.visible.right.sidebar ~ .fixed, .ui.visible.right.sidebar ~ .pusher {
    -webkit-transform: translate3d(-154px,0,0);
    transform: translate3d(-154px,0,0);
}


.ui.segment.pushable {
    position: fixed;
    top: 60px;
}
.pusher{
    width:100%;
    height:100%;
}
#puserBody {
    height: 100%;
    width: 100%;
    margin:0px;
    padding:0px;
    border:0px;
}

.PageTittle {
    height: 100%;
    width: 100%;
    align-content: center;
}

    .PageTittle h1 {
        color: #ccc;
        margin-top: 20px;
    }

.right.menu {
    width: 180px;
    align-content: center;
}

.logo {
    margin-left:30px;
    width: 120px;
    height: 35px;
    margin-top: 13px;
}


/*流式布局*/
.fluItem {
    margin: 3px;
    float: left;
}

.flu label, input {    
    margin: 3px;
    float: left;
}
.flu input{
    border-bottom:0px;
}

.flu {
     float: left;
}

thead{
    background-color:#cee;
}

/*表格中的a鼠标显示hand，点击排序*/
table a {
    cursor: pointer;
}
.ListTable {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    table-layout: fixed;
    word-wrap: break-word;
    word-break: break-all;
    white-space: nowrap;
}

    .ListTable td {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        text-align: center;
        /* border:1px dotted red;*/
        /*对应行高，需要在代码的每个td中加入style='padding:*px;'，不然高度调节无效*/
    }

    #mainTable {
    height: 100%;
    width: 100%;
    background-color: #fafafa;
    padding: 0px;
    margin: 0px;
}


#mainLeftTable {
    height: 100%;
    width: 100%;
}

#mainLeftTopDiv {
    height: 100%;
    width: 100%;
    margin:0px;
}

#mainLeftTopTable td:first-child{
    width:400px;
}

#mainLeftBottomDiv {
    height: 100%;
    width: 100%;
    padding: 0px;
}

#mainLeftBottomTable {
    height: 100%;
    width: 100%;
    margin:0px;
    margin-top:-20px;
    min-height:180px;
}

#mainRightTable {
    height: 100%;
    width: 100%;
}

#mainRightTopDiv{
    height: 100%;
    width: 100%;
    margin-left:-5px;
    border:0px;
    padding:0px;
}
#mainRightButtomDiv {
    height: 100%;
    width: 100%;
    margin-left: -5px;
    border: 0px;
    padding: 0px;
    float:right;
}

#pieChart {
    border: 0px;
    margin: 0px;
    padding: 0px;
    width:400px;
    height:250px;
}

#orderInfoTable {
    width: 100%;
    height:100%;
}
    #orderInfoTable tr{
        height:50px;
    }

    #mainLeftTopTable {
        width: 100%;
        height: 100%;
    }

#orderInfoTable td {
    font-size: 20px;
    color: blue;
    height: auto;
}
#orderInfoTable td:first-child{
    width:auto;
}

.cards {
    height: 165px;
    width: 160px;
    vertical-align: middle;
    display: table-cell;
    text-align: center;
    padding: 0px;
}


/*物料绑定样式*/
#divScroll {
    overflow-x: scroll;
    overflow-y: auto;
    position: relative;
    height: 100%;
    background-color: #333
}
#MaterialInfoDiv {
    position: absolute;
}
#MaterialShow {
    text-align: center;
    vertical-align: top;
}
#warningDiv {
    position: fixed;
    bottom: 55px;
    width: 100%;
    color: red;
    background-color: yellow;
    font-size: 12px;
}
#BindButton {
    position: fixed;
    bottom: 15px;
    width: 100px;
    height: 40px;
    color: red;
    background-color: #cfc;
    font-size: 16px;
}
#full {
    position: fixed;
    bottom: 55px;
    width: 100px;
    height: 40px;
    color: red;
    background-color: #cfc;
    font-size: 16px;
}
#MaterInput {
    position: fixed;
    bottom: 15px;
    width: 100%;
    height: 40px;
    background-color: #cfc;
    font-size: 16px;
}
.SearchTd {
    height: 45px;
    width:100%;
    vertical-align: top;
    margin-top:0px;
}
    .SearchTd .ui.grid {
        height: 45px;
     /*   vertical-align: top;*/
        padding: 0px;
        margin-top: 0px;
        border: 0px;
    }
    .SearchTd .eight.wide.column {
        padding-top: 3px;
    }
/*    .SearchTd .ui.grid {
        background-color:#faf;
    }*/
    .ui.visible.message {
        margin-bottom: 0px;
    }

    /*PCB绑定页面样式*/

#PCBBindTable{
    width:100%;
    height:100%;
}
    #PCBBindTable td {
        width: 100%;
    }
    #PCBBindTable tr:nth-child(2) {
        height: 100%;
    }
    #PCBBindTable .flu.ui.visible.message {
        width: 100%;
    }
#PCBBindMaterListTable {
    height: 100%;
    width: 100%;
}
    #PCBBindMaterListTable tr{
        height: 100%;
    }
    #PCBBindMaterListTable td:nth-child(1) {
        width: 100%;
        height: 100%;
    }
    #PCBBindMaterListTable td:nth-child(2) {
        height: 100%;
        vertical-align: top;
        background-color:#333;
    }
        #PCBBindMaterListTable td:nth-child(2) .focus {
            width: 200px;
        }
#resultDiv {
    height: 100px;
    background-color: gray;
}
#resultDiv h1{
    line-height: 100px;
    color:blue;
}

#infoDiv {
    font-size: 16px;
    color: white;
    background-color:red;
    height:auto;
    width:200px;
    margin-top:10px;
}
#PCBBindMaterListTable table {
    text-align: center;
    vertical-align: top;
}
#divScroll {
    overflow-x: scroll;
    overflow-y: scroll;
    position: relative;
    height: 100%;
    height:100%;
    background-color: #333;
}



    #MaterialShow {
        margin: 0px;
        padding: 0px;
        border: 0px solid salmon;
        text-align: left;
    }

    #MaterialShow td {
        height: 45px;
        padding: 0px;
        margin: 0px;
        border:0px;
    }
        #MaterialShow tr {
            height: 40px;
            padding: 0px;
            margin: 0px;
            border: 0px;
        }

        #MaterialShow td:first-child {
            background-color: #aaf;
            width: 100px;
        }

.rootMaterialDiv {
    height: 100%;
    float: left;
    white-space: nowrap;
    padding: 0px;
    margin: 0px;
}

    .rootMaterialDiv label {
        color: white;
    }

.childrenMaterialDiv {
    padding: 0px;
    margin: 0px;
    height: 100%;
    position: relative;
    display: inline-block;
}

    .childrenMaterialDiv div {
        padding: 0px;
        margin: 0px;
        height: 100%;
    }

.ui.small.fade.reveal {
    width: 100%;
    height: 45px;
    text-align: center;
    border: 1px solid red;
}

/*错误提示框*/
#errShowModal {
    width: 500px;
    margin-left: -250px;
    top: 20px;
    float: left;
    position: absolute;
    left: 50%;
    font-size: 20px;
}
#infoShowModal {
    width: 500px;
    margin-left: -250px;
    top: 20px;
    float: left;
    position: absolute;
    left: 50%;
    font-size: 20px;
}

.onelineDiv {
    width:100%;
}
    .onelineDiv .ui.floating.message {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 5px;
    }

/*物料录入样式*/
#MaterInputPart #scanBox{
    font-size: 20px;
}
#MaterInputPart .ui.grid{
    margin-top: 10px;
}
#MaterInputPart table{
    width: 100%;
}
#MaterInputPart .input{
    width: 100%;
}
#MaterInputPart #InputButton{
    width:100%;
    margin-top:20px
}