SOURCE

console 命令行工具 X clear

                    
>
console
$(function(){
    $("#PCBSNInput,#TSNInput,#FSNInput,#MACInput").keyup(function(e){
        if(e.key== "Enter"){
            if(getNextInputId().length>0){
                $("#"+getNextInputId()).focus()
            }
            else{
                //post提交数据
            }
        }
    });
})

function SNCheck(idStr){
    if($("#"+idStr).prop("checked")){
        $("#"+idStr+"Input").removeAttr("disabled");
    }
    else{
        $("#"+idStr+"Input").attr("disabled","disenabled");
    }
}
function getNextInputId()
{
    if($("#PCBSN").prop("checked") && $("#PCBSNInput").val()=="")
        return "PCBSNInput";
    if($("#TSN").prop("checked") && $("#TSNInput").val() == "")
        return "TSNInput";
    if($("#FSN").prop("checked") && $("#FSNInput").val() == "")
        return "FSNInput";
    if($("#MAC").prop("checked") && $("#MACInput").val() == "")
        return "MACInput";
    return "";
}
<div class="ui grid">
  <div class="twelve wide column">
      <table style="width:100%;height:100%;">
          <tr>
              <td>
                    <table class="BindSNInputTable">
                        <tr>
                                <td>
                                    PCB SN:
                                </td>
                                <td>
                                    <div class="ui input">
                                        <input type="text" id="PCBSNInput" disabled>
                                    </div>
                                    
                                </td>
                                <td>
                                    <div class="ui checkbox" onclick="SNCheck('PCBSN')">
                                        <input type="checkbox" id="PCBSN">
                                        <label></label>
                                    </div>
                                </td>
                        </tr>
                        <tr>
                                <td>
                                    临时SN:
                                </td>
                                <td>
                                    <div class="ui input">
                                        <input type="text" id="TSNInput" disabled>
                                    </div>
                                </td>
                                <td>
                                    <div class="ui checkbox" onclick="SNCheck('TSN')">
                                        <input type="checkbox" id="TSN">
                                        <label></label>
                                    </div>
                                </td>
                        </tr>
                        <tr>
                                <td>
                                    Fanvil SN:
                                </td>
                                <td>
                                    <div class="ui input">
                                        <input type="text" id="FSNInput" disabled>
                                    </div>
                                </td>
                                <td>
                                    <div class="ui checkbox" onclick="SNCheck('FSN')">
                                        <input type="checkbox" id="FSN">
                                        <label></label>
                                    </div>
                                </td>
                        </tr>
                        <tr>
                                <td>
                                    MAC:
                                </td>
                                <td>
                                    <div class="ui input">
                                        <input type="text" id="MACInput" disabled>
                                    </div>
                                </td>
                                <td>
                                    <div class="ui checkbox" onclick="SNCheck('MAC')">
                                        <input type="checkbox" id="MAC">
                                        <label></label>
                                    </div>
                                </td>
                        </tr>
                    </table>
              </td>
          </tr>
          <tr class="infoShowTr">
              <td>
                    <div class="InfoShowDiv">
                        <h1 style="color:#55a">已绑定的SN信息:</h1>
                        <table class="ui mini selectable striped table">
                            <thead>
                                <tr>
                                <th>PCB SN</th>
                                <th>临时SN</th>
                                <th>Fanvil SN</th>
                                <th>MAC</th>
                                </tr>
                            </thead>
                            <tbody style="overflow-x: hidden; overflow-y: auto;">
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                                <tr>
                                <td>PCBSN0001</td>
                                <td>TSN00001</td>
                                <td>FSN00001</td>
                                <td>000102030405</td>
                                </tr>
                            </tbody>
                        </table>


                    </div>
              </td>
          </tr>
      </table>
        
        
  </div>
  <div class="four wide column">

        <table class="ui very basic table" style="font-size:16px;">
        <tbody>
            <tr>
            <td>组装段服务器</td>
            <td>192.168.1.2</td>
            </tr>
            <tr>
            <td>组装段订单</td>
            <td>SC00001</td>
            </tr>
            <tr>
            <td>组装段站位</td>
            <td>Test01</td>
            </tr>
        </tbody>
        </table>
        
    组装段信息在系统设置中修改。
  </div>
</div>
.ui.grid{
    height: 100%;
}
.column{
    border: 1px solid red;
}
.BindSNInputTable{
    padding-left: 30%;
}
.BindSNInputTable tr{
    height: 20px;
}
.BindSNInputTable input{
    width: 240px;
    font-size: 16px;
    padding: 0px;
}
.infoShowTr{
    height: 100%;
}
.InfoShow{
    width: 100%;
    height: 100%;
    overflow-x: hidden; 
    overflow-y: auto;
    background-color: #fafafa
}
.selectable.table td{
    padding: 5px;
}

本项目引用的自定义外部资源