Question

所以我在这里要做的是从clubMemebers复制一个html表。将该表粘贴到两个新位置，并在第二个＆＃34; new＆＃34;表叫tblBody;将其第一行可见性设置为隐藏，将单元格中的文本更改为＆＃39;＆＃39; （没有）并使其高度= 0px ......基本上。

这个问题对大多数人来说可能是一个显而易见的问题......它们都与一个表相关联，因此对一个表的更改将对它们进行全部更改......

如何将这些表分开以完成我需要做的事情？我试图搜索，但我想到的只是将表复制到剪贴板或excel。

下面是我正在使用的html和javascript。

<div id="DivHeaderRow"></div>
<div class="gridDiv" id="gridDiv" onscroll="OnScrollDiv(this)"></div>
<div id="DivFooterRow"></div>

<table style="width: 100%;" class="MemberTbl" runat="server" id="clubMembers" >
    <tr class="Header" style="position:fixed;"></tr>
</table>

和javascript：

function MakeStaticHeader(gridId, height, width, headerHeight, isFooter) {
    var tblHead = document.getElementById(gridId);
    var tblBody = document.getElementById(gridId);
    if (tblHead) {
        var DivHR = document.getElementById('DivHeaderRow');
        var DivMC = document.getElementById('gridDiv');
        var DivFR = document.getElementById('DivFooterRow');

        //*** Set divheaderRow Properties ****
        DivHR.style.height = headerHeight + 'px';
        DivHR.style.position = 'relative';
        DivHR.style.top = '10px';
        DivHR.style.zIndex = '10';
        DivHR.style.verticalAlign = 'top';
        DivHR.style.overflow = 'hidden';

        //*** Set divMainContent Properties ****
        DivMC.style.position = 'relative';
        DivMC.style.zIndex = '1';

        //*** Set divFooterRow Properties ****
        DivFR.style.width = (parseInt(width) - 16) + 'px';
        DivFR.style.position = 'relative';
        DivFR.style.top = -headerHeight + 'px';
        DivFR.style.verticalAlign = 'top';
        DivFR.style.paddingtop = '2px';
        DivFR.style.overflow = 'hidden';

        if (isFooter) {
            var tblfr = tbl.cloneNode(true);
            tblfr.removeChild(tblfr.getElementsByTagName('tbody')[0]);
            var tblBody = document.createElement('tbody');
            tblfr.style.width = '100%';
            tblfr.cellSpacing = "0";
            //*****In the case of Footer Row *******
            tblBody.appendChild(tbl.rows[tbl.rows.length - 1]);
            tblfr.appendChild(tblBody);
            DivFR.appendChild(tblfr);
        }
        //****Copy Header in divHeaderRow****
        var tblBodyRow = tblBody.rows[0];
        tblBodyRow.style.visibilty = 'hidden';
        tblBodyRow.style.height = '0px';       

        for(var i = 0, tblBodyRow; tblBodyCell = tblBodyRow.cells[i]; i++)
        {
          tblBodyCell.innerHTML = '';   
        }                

        DivHR.appendChild(tblHead.cloneNode(true));
        DivMC.appendChild(tblBody.cloneNode(true));
    }
}

function OnScrollDiv(Scrollablediv) {
    document.getElementById('DivHeaderRow').scrollLeft = Scrollablediv.scrollLeft;
    document.getElementById('DivFooterRow').scrollLeft = Scrollablediv.scrollLeft;
}

window.onload = function () {
    MakeStaticHeader('clubMembers', 100, 400, 25, false)
}

Answer 1

也许你的问题会被解决，改变你的界限：

var tblHead = document.getElementById(gridId);
var tblBody = document.getElementById(gridId);

有：

var tblHead = document.getElementById(gridId).cloneNode(true);
var tblBody = document.getElementById(gridId).cloneNode(true);

但是，也许你可以尝试使用jquery来操作DOM元素......然后，用这样的东西就足够了（参见Fiddle）：

tableHtml = $('#clubMembers').html();
$('#DivHeaderRow').html(tableHtml);
$('#DivHeaderRow').find("tr").first().hide();
$('#gridDiv').html(tableHtml);

在javascript中挑出特定的个别控件

1 个答案: