上海的统计局用的是框架写的

解决方案 »

  1.   

    你是要做“上海的统计局”这样的吗?
    做一个框架
    左边和右边表格做成一样的风格
    左边表格与数据库无关
    右边表格读取数据库
      

  2.   

    类似的效果,给你一段代码,希望对你有帮助:<script>
    var rowNum = 20;
    var colNum = 9;
    // Array that holds the columns width
    var arrTDwidth = new Array (77, 31, 71, 113, 52, 53, 41, 64, 55, 90, 
    70, 145, 23, 50, 30, 120, 200, 80, 70, 180, 12, 90, 70, 145, 23, 50, 
    30, 120, 200, 80, 70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 
    70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 70, 180, 12, 90, 
    70, 145, 200, 80, 70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 
    70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 70, 180, 12, 90, 
    70, 145, 200, 80, 70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 
    70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 70, 180, 12, 90, 
    70, 145, 200, 80, 70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 
    70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 70, 180, 12, 90, 
    70, 145, 200, 80, 70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 
    70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 70, 180, 12, 90, 
    70, 145, 200, 80, 70, 180, 12, 90, 70, 145, 23, 50, 30, 120, 200, 80, 
    70, 180, 12, 90, 70);
    function drawTab (rows, cols, color, id)
    {
    sHTML = "<TABLE id='"+id+"' bgcolor='"+color+"' border=1 style='tableLayout:fixed'>";
    count=0;
    sHTML += "\n<THEAD id='downTblHead'>\n";
    i=0;
    for (var j=0; j < cols; j++)
    {
    width = arrTDwidth;
    sHTML += "<TH id='a0"+j+"' nowrap style='word-wrap: break-word;'>这是: Row"+i+"Col"+j+"</TH>";
    //sHTML += "<TH id='a0"+j+"' nowrap style='word-wrap: break-word;' style='width:"+arrTDwidth[count]+"pt;'>这是: Row"+i+"Col"+j+"</TH>";
    count++;
    }
    count = 0;
    sHTML += "\n</THEAD>\n";
    sHTML += "\n<TBODY>\n";
    for (var i=1; i<rows; i++)
    {
    sHTML += "\n<TR>\n";

    for (var j=0; j<cols; j++)
    {
    width = arrTDwidth;
    sHTML += "<TD id='a"+i+j+"' style='width:150;'>这是: Row"+i+"Col"+j+"</TD>";
    //sHTML += "<TD id='a"+i+j+"' style='word-wrap: break-word;' nowrap style='word-wrap: break-word;' style='width:"+arrTDwidth[count]+"pt;'>这是: Row"+i+"Col"+j+"</TD>";
    count++;
    }
    count = 0
    sHTML += "\n</TR>\n";
    } sHTML += "\n</TBODY>\n";
    sHTML += "\n</TABLE>"; return sHTML;

    }function cloneHeader ()
    {
    var x = document.all['downTblHead'].cloneNode(true);
    for (var j = 0; j < colNum; j++)
    {
    document.all['a0'+j].id = 'head'+j;
    }
    document.all['downTblHead'].id = "downTblHead4hidden";
    document.all['upTbl'].appendChild(x);
    document.all['upTbl'].width = document.all['downTblHead4hidden'].offsetWidth;
    synchronizeHeader ()
    }function synchronizeHeader ()
    {
    var ok = true;
    var max = 0;
    while (ok && max < 20)
    {
    max++;
    ok = false;
    for (var j = 0; j < colNum; j++)
    {
    if (document.all['a0'+j].offsetWidth != document.all['head'+j].offsetWidth)
    {
    ok = true;
    document.all['a0'+j].style.width = document.all['head'+j].offsetWidth;
    }
    }
    }}function getScrollBraWidth ()
    {
    try
    {
    var elem = document.createElement("DIV");
    elem.id = "asdf";
    elem.style.width = 100;
    elem.style.height = 100;
    elem.style.overflow = "scroll";
    elem.style.position = "absolute";
    elem.style.visibility = "hidden";
    elem.style.top = "0";
    elem.style.left = "0";
    document.body.appendChild (elem);
    scrollWidth = document.all['asdf'].offsetWidth - document.all['asdf'].clientWidth;
    document.body.removeChild (elem);
    delete elem;
    }
    catch (ex)
    {
    return false;
    } return scrollWidth;
    }function findPosX (obj)
    {
    var curleft = 0;
    while (obj.offsetParent)
    {
    curleft += obj.offsetLeft
    obj = obj.offsetParent;
    }
    return curleft;
    }</script><body bgcolor="#000000", text="#ffffff" onLoad="cloneHeader ();"><div id="headerContainer" style="position: absolute; z-index:2;">
    <TABLE  id='upTbl' bgcolor='gray' border=1 style="tableLayout:fixed">
    </TABLE>
    </div><div id="dataContainer" style="height:300;overflow:scroll; z-index:1; position: absolute;" >
    <script language="JavaScript">
    <!--
    document.write(drawTab(rowNum, colNum, "", "data"));
    document.all['dataContainer'].style.width = document.all['data'].offsetWidth + getScrollBraWidth ();
    document.all['headerContainer'].style.width = document.all['data'].offsetWidth;
    //-->
    </script>
    </div></body>
    </html>