使用 javascript 从 html table 导出到 excel 时隐藏列

Question

我有一个 html table ，我必须将其导出到 excel ，但是在这样做的同时，我不希望导出某些 td 元素。当我应用 javascript 隐藏 td 时，更改仅应用于视图表单，而不应用于导出的内容。

在这种情况下需要有关如何导出的帮助。

我已将 html、css 和脚本全部包含在一页中。

<html>
<body>
<div id="myDiv">
<table id="metrics" border="1px" cellspacing="0 px" style="border-style:  solid; border-color: Black;
        border-width: thin;">
        <tr>
            <td style= "background-color: #bfbfbf;  font-size: small; color: black;">
                LOB
            </td>
            <td>
                <span class="hillbillyForm" data-displayname='LOB' style="display:none;"></span>

           </td>
       </tr>
</table>
    <input type="button" id="btnExport"  value="Export" onclick="TableToExcel('metrics');" />
</div>
</body>

这里我想隐藏包含span的td class "hillbillyForm"

我用的javascript是

    function TableToExcel(tableid) {

        var id = $('[id$="' + tableid + '"]');
        var $clonedTable = $("id").clone();
        $clonedTable.find('[style = "display: none"]').remove();
        var strCopy = $('<div></div>').html(id.clone()).html();

        window.clipboardData.setData("Text", strCopy);

        var objExcel = new ActiveXObject("Excel.Application");

        objExcel.visible = false; var objWorkbook = objExcel.Workbooks.Add; var objWorksheet = objWorkbook.Worksheets(1); objWorksheet.Paste; objExcel.visible = true;
    }
</script>

Answer 1

所以我的理解是您想删除所有与 class hillbillyForm 有直接子代的 TD。

你可以这样做：

var form = document.getElementById(tableid),
    exportForm = form.cloneNode(true),
    elementsToRemove = exportForm.querySelectorAll('.hillbillyForm');

for (var i = elementsToRemove.length; i--;){
    var td = elementsToRemove[i].parentElement;
    if (td) td.parentElement.removeChild(td);
}

使用 javascript 从 html table 导出到 excel 时隐藏列

Hide column while exporting to excel from html table using javascript

html

javascript

excel

jsFiddle