動態添加多tab，並初始化每個tab頁面

這裏演示的只是我在項目中遇到的，根據自己的實際情況，自己修改。

html中只寫了個class爲easyui-tabs的div

<div id="center" data-options="region:'center'">
        <!--這個定義div的id，後面需要用到-->
        <div id="tabs_D" class="easyui-tabs" >
           
        </div>
    </div>

當頁面加載的時候根據自己的情況進行動態的加載tab頁面；

//其中的addTabw爲添加tab的方法
function initTableTabs(){ 
    $.post('../../../BaseMessage/PUSH/XSJHService.ashx?m=SelectFDMBByCXHDBH', { "CXHDBH":                 C_CXHDBH }, function (res) {
                var _Data = JSON.parse(res);
                var _RowsFD = _Data.INFOFD;
                var _RowsRQ  = _Data.INFORQ;
                if (_RowsFD != null) {
                    for (var k in _RowsFD) {
                        addTabw(_RowsFD[k].FDMC, 'DGY_Detail_Mode_dg_' + _RowsFD[k].FDBH);
                        window["FDRQData_"+ _RowsFD[k].FDBH]=[];
                        if (_RowsRQ != null) {
                            for (var i in _RowsRQ) {
                                if( _RowsRQ[i].FDBH == _RowsFD[k].FDBH){
                                    window["FDRQData_"+ _RowsFD[k].FDBH].push(_RowsRQ[i]);
                                }
                            }
                        }
                    //在這裏給datagrid賦值
                        $("#DGY_Detail_Mode_dg_" + _RowsFD[k].FDBH).datagrid('loadData', window["FDRQData_" + _RowsFD[k].FDBH]);
                        }
                    }
                }
            });    
}       

//添加tab，初始化tab，給tab上的table賦值

//選中一個tab，輸入title
function selectTabw(title) {
        if ($('#tabs_D').tabs('exists', title)) {
                $('#tabs_D').tabs('select', title);//如果存在當前頁面，則跳轉到頁面
            }
        }
//添加tab，tab的content爲一個table，且tab爲不可關閉，如果要改爲可關閉的，false改爲true，
//其實這兩個爲一個方法，要先判斷是否存在這個頁面，存在則不用再加入了，不過，我這裏調用時，肯定傳入的title不同，所以沒有加判斷
        function addTabw(title, table_id) {
            var content = '<table id='+table_id+'></table>';
            $('#tabs_D').tabs('add', {//不存在，則添加一個
                title: title,
                content: content,
                closable: false
            });
            tableToInit(table_id);
        }

//初始化tableById
function tableToInit(table_id) {
            $("#"+table_id).datagrid({
                title: '',
                loadMsg: '正在加載數據...',
                rownumbers: true,
                singleSelect: true,
                multiSort: false,
                remoteSort: true,
                columns: [[
                    { title: '銷售計劃ID', field: 'CXHDBH', align: 'center', sortable: true, wdith: 120  },
                    { title: '分店名稱', field: 'FDMC', align: 'center', sortable: true, wdith: 200 },
                    { title: '日期', field: 'RQ', align: 'center', sortable: true, wdith: 200 },
                    {
                        title: '目標（萬元）', field: 'XSMB', align: 'center', width: 100, sortable: true,
                        formatter: function (value, row, index) {
                            return value == null ? '' : value;
                        }
                    },
                    { title: '登記人', field: 'DJRMC', align: 'center', width: 100, sortable: true },
                    {
                        title: '登記時間', field: 'DJSJ', align: 'center', width: 120, sortable: true,
                        formatter: function (value, row, index) {
                            return value != null ? value.replace("T", " ") : "";
                        }
                    }
                ]],
                pageSize: 1000
            });

        }