~whyclj/zijing.git

//定义一个自动创建表格的函数 
//cont容器id,cla表格的类名，col表格的行数， 
//ThArr表格的头数据，TdArr表格的单元格数据 
function createTable(cont,cla,col,ThArr,TdArr){ 
    $("#"+cont).children('table').remove(); 
    var _table=$('<table class="' + cla + '"></table>'); 
    var _thead=$('<thead></thead>'); 
    var _tbody=$('<tbody></tbody>'); 
    var ThArray=new Array();    //设置th的数组 
    var TrArray=new Array();    //设置tr的数组 
    var TdArray=new Array();    //设置td的数组 
    var TdLength;    //获取单元格个数 
    var TrLength; //获取行数 
    TdLength=TdArr.length; 
    TrLength=Math.ceil(TdLength/col); 
    // 给每个th设置值 
    for(var i=0;i<col;i++) 
    { 
        ThArray[i]=$("<th>"+ThArr[i]+"</th>"); 
    } 
    // 给每个td设置值 
    for(var i=0;i<TdLength;i++) 
    { 
        TdArray[i]=$("<td>"+TdArr[i]+"</td>"); 
    } 
    //设置tr 
    for(var i=0;i<TrLength;i++) 
    { 
        TrArray[i]=$("<tr></tr>"); 
    } 
    //将td以col个赋给tr 
    var n=0; 
    for(var i=0;i<TrLength;i++) 
    { 
        for(var k=0;k<col;k++) 
        { 
            TrArray[i].append(TdArray[n]); 
            n++; 
        } 
    } 
    //给th赋给thead 
    for(var i=0;i<col;i++) 
    { 
        _thead.append(ThArray[i]); 
    } 
    _table.append(_thead); 
    // 将tr赋给table 
    for(var i=0;i<TrLength;i++) 
    { 
        _tbody.append(TrArray[i]); 
    } 
    _table.append(_tbody); 
    //将table添加到指定的容器中 
    $("#"+cont).append(_table); 
} 
 
//定义一个自动创建表格的函数 
//ThArr表格的头数据，TdArr表格的单元格数据 
function createTablenew(ele,ThArr,TdArr){ 
    ele.children('table').remove(); 
    var _table=$('<table></table>'); 
    var _thead=$('<thead></thead>'); 
    var _tbody=$('<tbody></tbody>'); 
    var ThArray=new Array();    //设置th的数组 
    var TrArray=new Array();    //设置tr的数组 
    var TdArray=new Array();    //设置td的数组 
    var TdLength;    //获取单元格个数 
    var TrLength; //获取行数 
    TdLength=TdArr.length; 
    TrLength=Math.ceil(TdLength/ThArr.length); 
    // 给每个th设置值 
    for(var i=0;i<ThArr.length;i++) 
    { 
        ThArray[i]=$("<th>"+ThArr[i]+"</th>"); 
    } 
    // 给每个td设置值 
    for(var i=0;i<TdLength;i++) 
    { 
        TdArray[i]=$("<td>"+TdArr[i]+"</td>"); 
    } 
    //设置tr 
    for(var i=0;i<TrLength;i++) 
    { 
        TrArray[i]=$("<tr></tr>"); 
    } 
    //将td以col个赋给tr 
    var n=0; 
    for(var i=0;i<TrLength;i++) 
    { 
        for(var k=0;k<ThArr.length;k++) 
        { 
            TrArray[i].append(TdArray[n]); 
            n++; 
        } 
    } 
    //给th赋给thead 
    for(var i=0;i<ThArr.length;i++) 
    { 
        _thead.append(ThArray[i]); 
    } 
    _table.append(_thead); 
    // 将tr赋给table 
    for(var i=0;i<TrLength;i++) 
    { 
        _tbody.append(TrArray[i]); 
    } 
    _table.append(_tbody); 
    //将table添加到指定的容器中 
    ele.append(_table); 
} 
 
//定义一个自动创建表格的函数 
//ThArr表格的头数据;TdArr表格的单元格数据;TrArr表格的行编号数据 
function createTbl(ele,ThArr,TdArr,TrArr){ 
    ele.children('table').remove(); 
    var _table=$('<table></table>'); 
    var _thead=$('<thead></thead>'); 
    var _tbody=$('<tbody></tbody>'); 
    var ThArray=new Array();    //设置th的数组 
    var TrArray=new Array();    //设置tr的数组 
    var TdArray=new Array();    //设置td的数组 
    var TdLength;    //获取单元格个数 
    var TrLength; //获取行数 
    TdLength=TdArr.length; 
    TrLength=Math.ceil(TdLength/ThArr.length); 
    // 给每个th设置值 
    for(var i=0;i<ThArr.length;i++) 
    { 
        ThArray[i]=$("<th>"+ThArr[i]+"</th>"); 
    } 
    // 给每个td设置值 
    for(var i=0;i<TdLength;i++) 
    { 
        TdArray[i]=$("<td>"+TdArr[i]+"</td>"); 
    } 
    //设置tr 
    for(var i=0;i<TrLength;i++) 
    { 
        TrArray[i]=$("<tr num='"+TrArr[i]+"'></tr>"); 
    } 
    //将td以col个赋给tr 
    var n=0; 
    for(var i=0;i<TrLength;i++) 
    { 
        for(var k=0;k<ThArr.length;k++) 
        { 
            TrArray[i].append(TdArray[n]); 
            n++; 
        } 
    } 
    //给th赋给thead 
    for(var i=0;i<ThArr.length;i++) 
    { 
        _thead.append(ThArray[i]); 
    } 
    _table.append(_thead); 
    // 将tr赋给table 
    for(var i=0;i<TrLength;i++) 
    { 
        _tbody.append(TrArray[i]); 
    } 
    _table.append(_tbody); 
    //将table添加到指定的容器中 
    ele.append(_table); 
} 
 
//向表格中追加数据 
function addTd(ele,len,__ArrTd){ 
    //定义tr和td标签 
    var __ArrTagTr=new Array(); 
    var __ArrTagTd=new Array(); 
    var __TrLength=0; 
    __TrLength=Math.ceil(__ArrTd.length/len); 
    //创建tr 
    for(var i=0;i<__TrLength;i++) 
    { 
        __ArrTagTr[i]=$('<tr class="red" newTd></tr>'); 
    } 
    //给每个td添加文本 
    for(var i=0;i<__ArrTd.length;i++) 
    { 
        __ArrTagTd[i]=$('<td>'+__ArrTd[i]+'</td>'); 
    } 
    var n=0; 
    //根据len将td添加到对应的行 
    for(var i=0;i<__TrLength;i++) 
    { 
        for(var k=0;k<len;k++) 
        { 
            __ArrTagTr[i].append(__ArrTagTd[n]); 
            n++; 
        } 
    } 
    for(var i=0;i<__TrLength;i++) 
    { 
        ele.append(__ArrTagTr[i]); 
    } 
} 
 
 
//js创建表格选项内容 
function createCard(ele,ArrTh,ArrTd){ 
    ele.children('table').remove(); 
    var __table=$('<table></table>'); 
    var __thead=$('<thead></thead>'); 
    var __tbody=$('<tbody></tbody>'); 
    var __ArrTh=new Array(); 
    var __ArrTr=new Array(); 
    var __ArrTd=new Array(); 
 
    // 通过for循环将值给th 
    for(var i=0;i<ArrTh.length;i++) 
    { 
        __ArrTh[i]=$('<th>'+ArrTh[i]+'</th>'); 
    } 
    // 将th放到thead内 
    for(var i=0;i<ArrTh.length;i++) 
    { 
        __thead.append(__ArrTh[i]); 
    } 
    //通过ArrTd的长度设置tr的个数 
    for(var i=0;i<ArrTd.length;i++) 
    { 
        __ArrTr[i]=$('<tr></tr>'); 
    } 
    // 通过for循环将值给td 
    for(var i=0;i<ArrTd.length;i++) 
    { 
        for(var k=0;k<ArrTd[0].length;k++) 
        { 
            var n=i*ArrTd[0].length+k; 
            __ArrTd[n]=$('<td>'+ArrTd[i][k]+'</td>'); 
        } 
    } 
    // 将td放到tr中 
    for(var i=0;i<ArrTd.length;i++) 
    { 
        for(var k=0;k<ArrTd[0].length;k++) 
        { 
            var n=i*ArrTd[0].length+k; 
            __ArrTr[i].append(__ArrTd[n]); 
        } 
    } 
    // 将tr放到tbody中 
    for(var i=0;i<ArrTd.length;i++) 
    { 
        __tbody.append(__ArrTr[i]); 
    } 
    //将thead和tbody添加到table中 
    __table.append(__thead); 
    __table.append(__tbody); 
    //将span添加到容器中 
    ele.append(__table); 
} 
 
//创建等待的框框 
function createWait(ele){ 
    var __eleWidth=ele.width(); 
    var __wait=$('<div class="wait">'+"数据加载中，请稍等..."+'</div>'); 
    //var __mask=$('<div class="mask"></div>'); 
    var __left=ele.scrollLeft()+__eleWidth/2; 
    ele.append(__wait); 
    //定义等待框的css 
    ele.children('.wait').css({ 
        'position':'absolute', 
        'z-index':'100', 
        'top':'50%', 
        'margin-top':'-30px', 
        'left':__left+'px', 
        'margin-left':'-100px', 
        'width':'200px', 
        'height':'60px', 
        'line-height':'60px', 
        'text-align':'center', 
        'font-size':'16px', 
        'background-color':'#ccc', 
        'color':'#000' 
    }); 
} 
 
//移除等待框 
function removeWait(ele){ 
    ele.children('.wait').remove(); 
    $('body').children('.mask').remove(); 
} 
 
 
$(document).ready(function(){ 
    // 点击显示表格选项 
    $('#container .cardOpt').click(function(){ 
        $('#cardOption').show(); 
        $('#allShade').show(); 
        $('body').css('overflow','hidden'); 
    }); 
    // 点击隐藏表格选项 
    $('#outCardOption').click(function(){ 
        $('#cardOption').hide(); 
        $('#allShade').hide(); 
        $('body').css('overflow','scroll'); 
    }); 
    // 浏览器滚动时表格选项和遮罩层的位置改变 
    $(document).scroll(function(){ 
        var scrollY=$(this).scrollTop(); 
        $('#cardOption').css('top',scrollY+50+'px'); 
        $('#cardResisOption').css('top',scrollY+50+'px'); 
        $('#allShade').css('top',scrollY+'px'); 
    }); 
}); 
//在容器中创建文本框 
function createInput(ele,val){ 
    if(ele.find('input').length==0) 
    { 
        ele.text(''); 
        var __input=$('<input type="text" value="'+val+'" focus/>'); 
        ele.append(__input); 
    } 
} 
//通过表格选项的值返回表头数据 
function getArrTh(__stateArr,__arrTh){ 
    var __thIndex=0;        //新表头数据的下标 
    var __newTh=new Array();    //存储新的表头数据 
    for(var i=0;i<__arrTh.length;i++) 
    { 
        if(__stateArr[i]==1) 
        { 
            __newTh[__thIndex]=__arrTh[i]; 
            __thIndex++; 
        } 
    } 
    return __newTh; 
} 
//通过表格选项的值返回表内数据 
function getArrTd(__stateArr,__arrTd){ 
    var __tdIndex=0; 
    var __newTd=new Array(); 
    for(var i=0;i<__arrTd.length;i++) 
    { 
        var stateIndex=i%__stateArr.length;    //获取stateArr的下标 
        if(__stateArr[stateIndex]==1) 
            { 
                 __newTd[__tdIndex]=__arrTd[i]; 
                 __tdIndex++; 
            } 
    } 
    return __newTd; 
} 
//让表格头和表格内的宽度相等 
function widthEqual(eleHead,eleBody){ 
    var widthHead=new Array();  //获取头部单元格的宽度 
    var widthBody=new Array();  //获取表格内的单元格的宽度 
    var maxWidth=new Array();    //获取表格最宽 
    for(var i=0;i<eleHead.length;i++) 
    { 
        widthHead[i]=eleHead.eq(i).width(); 
    } 
    for(var i=0;i<eleHead.length;i++) 
    { 
        widthBody[i]=eleBody.eq(i).width(); 
    } 
    for(var i=0;i<eleHead.length;i++) 
    { 
        if(widthHead[i]>widthBody[i]) 
        { 
            maxWidth[i]=widthHead[i]; 
        }else{ 
            maxWidth[i]=widthBody[i]; 
        } 
    } 
    // 将表格的第一行和头部的宽度相等 
    for(var i=0;i<eleHead.length;i++) 
    { 
        eleHead.eq(i).css('width',maxWidth[i]+'px'); 
            eleBody.eq(i).css('width',maxWidth[i]+'px'); 
    } 
} 
//在点击的容器内创建select标签 
//ele为容器，optArr为option的数据，txt为容器固有内容 
function createSelect(ele,optArr,txt){ 
    ele.text(''); 
    var __select=$('<select></select>'); 
    var __option=new Array(); 
    for(var i=0;i<optArr.length;i++) 
    { 
        if(txt==optArr[i]) 
        { 
            __option[i]=$('<option value="'+optArr[i]+'" selected>'+optArr[i]+'</option>'); 
        }else{ 
            __option[i]=$('<option value="'+optArr[i]+'">'+optArr[i]+'</option>'); 
        } 
    } 
    for(var i=0;i<optArr.length;i++) 
    { 
        __select.append(__option[i]); 
    } 
    ele.append(__select); 
} 
/* 
    创建表格 
    @param jquery对象 eleHead  表格头部容器 
    @param jquery对象 eleBody  表格body容器 
    @param array thList 表格头部数据 
    @param array tdList 表格body数据 
    @param array status 表格状态数组(没有则默认全部显示) 
*/ 
function createFullTbl(eleHead, eleBody, thList, tdList, status) { 
    if(arguments.length < 5) { 
        var status = new Array(); 
        for(var i = 0; i < thList.length; i++) { 
            status.push(1); 
        } 
    } 
    var arrNewTh = getArrTh(status, thList); 
    var arrNewTd = getArrTd(status, tdList); 
 
    createTablenew(eleHead, arrNewTh, arrNewTd); 
    createTablenew(eleBody, arrNewTh, arrNewTd); 
     
    setTblWidth(eleHead, eleBody); 
    eleBody.scroll(function() { 
        setTblWidth(eleHead, eleBody); 
    }); 
} 
 
/* 
    使表格的头部和body内容对齐 
    @param jquery对象 eleHead  表格头部容器 
    @param jquery对象 eleBody  表格body容器 
*/ 
function setTblWidth(tbHead, tbBody) { 
    var tblBdWd = tbBody.find('table').width(); 
    tbHead.find('table').width(tblBdWd); 
    var tbScrollLeft = tbBody.scrollLeft(); 
    tbHead.find('table').css('left', -tbScrollLeft + 'px'); 
} 
 
// 向已有的表格添加td 
function addTr(ele, TdArr) { 
    var _tbody=ele.find('tbody'); 
    var TdArray=new Array();    //设置td的数组 
    // 给每个td设置值 
    for(var i=0;i<TdArr.length;i++) 
    { 
        TdArray[i]=$("<td>"+TdArr[i]+"</td>"); 
    } 
    var _tr = $('<tr></tr>'); 
    _tr.append(TdArray); 
    //将tr添加到tbody的容器中 
    _tbody.append(_tr);     
} 
 
/* 
    创建表格 
    @param jquery对象 eleHead  表格头部容器 
    @param jquery对象 eleBody  表格body容器 
    @param array thList 表格头部数据 
    @param array tdList 表格body数据 
    @param array status 表格状态数组(没有则默认全部显示) 
*/ 
function addFullTr(eleHead, eleBody, thList, tdList, status) { 
    if(arguments.length < 5) { 
        var status = new Array(); 
        for(var i = 0; i < thList.length; i++) { 
            status.push(1); 
        } 
    } 
    var arrNewTd = getArrTd(status, tdList); 
    addTr(eleHead, arrNewTd);     
    addTr(eleBody, arrNewTd); 
 
    setTblWidth(eleHead, eleBody);     
} 
 
 
/* 
    更新表格的特定的单元格的值 
    @param 表格头部容器 tblHd 
    @param 表格内容容器 tblBd 
    @param 对象数组 list 存储更新表格的行列以及对应的值 
    {row:, col:, val:} row行号， col列号， val值 
*/ 
function updataTbl(tblHd, tblBd, list) { 
    var _hdTbody = tblHd.find('tbody');    // 表格头部的tbody 
    var _bdTbody = tblBd.find('tbody');    // 表格body的tbody 
 
    // 遍历list给特定的位置重新定义文本值 
    for(var i = 0; i < list.length; i++) { 
        var row = list[i].row; 
        var col = list[i].col; 
        var value = list[i].val; 
        _hdTbody.find('tr').eq(row).find('td').eq(col).text(value); 
        _bdTbody.find('tr').eq(row).find('td').eq(col).text(value); 
    } 
} 
 
 
/* 
 * 根据页面中表格数据生成表格第一次默认加载50条 
 * @param jquery tblHd 表格头部容器 
 * @param jquery tblBd 表格内容容器 
 * @param array thList 表格头部数据 
 * @param array tdList 所有的表格数据(全部查询出来) 
 * @param array status 表格状态数组(没有则默认全部显示) 
 *   
 */ 
function createTblByAllData(tblHd, tblBd, thList, tdList, status) { 
    if(arguments.length < 5) { 
        var status = new Array(); 
        for(var i = 0; i < thList.length; i++) { 
            status.push(1); 
        } 
    } 
     
    // 判断容器内是否有表格,如果不存在就截取表格数据的前50行数据进行创建表格 
    if(tblBd.find('table').length == 0) { 
        var newTdList = getArrTdList(); 
        createFullTbl(tblHd, tblBd, thList, newTdList, status); 
    } 
     
     
} 
 
/* 
 *根据行号和获取行数获取td的数据 
 *@param array thList 表格的头部数据 
 *@param array tdList 所有的表格数据(全部查询出来) 
 *@param int row 当前的行号 
 *@param int rows 要添加的行数 
 */ 
function getArrTdList(thList, tdList, row, rows) { 
    var tdList =new Array(); 
     
}