Question

我有一个Javascript代码将表格导出为Excel格式。它可以正常使用1个表和1个按钮。

JS

<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script type="text/javascript" language="javascript">
function TableToExcel()
{
    var id = $('#dvData');
    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>

HTML

<table  id="dvData">
                    <tr>
                        <th>Billing System</th>
                        <th>Market Code</th>
                        <th>Payment Amount</th>
                    </tr>
                    <tr>
                        <td>RED</td>
                        <td>222</td>
                        <td>$103.00</td>
                    </tr>
                    <tr>
                        <td>BLUE</td>
                        <td>111</td>
                        <td>$13.00</td>
                    </tr>
                    <tr>
                        <td>GREEN</td>
                        <td>555</td>
                        <td>$143.00</td>  
                    </tr>
                </table>
<br />
<input type="button" id="btnExport" value="Export" onclick="TableToExcel();" />

但是当我有多个表时，似乎Javascript不起作用！首先，ID更改为类，如下面的代码。

请帮忙！感谢

JS

<script type="text/javascript" language="javascript">
function TableToExcel()
{
    var class = $('.dvData .dvData1');
    var strCopy = $('<div></div>').html(class.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>

HTML

<table  class="dvData">
    <tr>
        <th>Account System</th>
        <th>Market Code</th>
        <th>Payment Amount</th>
    </tr>
    <tr>
        <td>RED</td>
        <td>222</td>
        <td>$103.00</td>
    </tr>
    <tr>
        <td>BLUE</td>
        <td>111</td>
        <td>$13.00</td>
    </tr>
    <tr>
        <td>GREEN</td>
        <td>555</td>
        <td>$143.00</td>  
    </tr>
</table>
<br />
<input type="button" id="btnExport" value="Export" onclick="TableToExcel();" /> 

<table  class="dvData1">
 <tr>
    <th>Billing System</th>
    <th>Market Code</th>
    <th>Payment Amount</th>
</tr>
<tr>
    <td>RED</td>
    <td>222</td>
    <td>$103.00</td>
</tr>
<tr>
    <td>BLUE</td>
    <td>111</td>
    <td>$13.00</td>
</tr>
<tr>
    <td>GREEN</td>
    <td>555</td>
    <td>$143.00</td>  
</tr>
</table>
<br />
<input type="button" id="btnExport" value="Export" onclick="TableToExcel();" />

Answer 1

class是javascript中的保留字。将变量名称更改为有效的名称，并使用逗号分隔多个元素：

var $class = $('.dvData, .dvData1');

以下是一种解决方案，让您按照预期的方式工作：

HTML：

<table  class="dvData">
    <tr>
        <th>Account System</th>
        <th>Market Code</th>
        <th>Payment Amount</th>
    </tr>
    <tr>
        <td>RED</td>
        <td>222</td>
        <td>$103.00</td>
    </tr>
    <tr>
        <td>BLUE</td>
        <td>111</td>
        <td>$13.00</td>
    </tr>
    <tr>
        <td>GREEN</td>
        <td>555</td>
        <td>$143.00</td>  
    </tr>
</table>
<br />
<input type="button" class="toExcelButton" data-target="dvData" id="btnExport" value="Export" onclick="TableToExcel();" /> 

<table  class="dvData1">
 <tr>
    <th>Billing System</th>
    <th>Market Code</th>
    <th>Payment Amount</th>
</tr>
<tr>
    <td>RED</td>
    <td>222</td>
    <td>$103.00</td>
</tr>
<tr>
    <td>BLUE</td>
    <td>111</td>
    <td>$13.00</td>
</tr>
<tr>
    <td>GREEN</td>
    <td>555</td>
    <td>$143.00</td>  
</tr>
</table>
<br />
<input type="button" class="toExcelButton" data-target="dvData1" id="btnExport" value="Export" onclick="TableToExcel();" />

JAVASCRIPT：

$(document).ready(function() {

    $(".toExcelButton").click(function() {
        var table = $("." + $(this).data('target'));
        var strCopy = $('<div></div>').html(table.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;
    });

});

Answer 2

首先：删除您的var class并尝试使用selection或其他内容，因为class已经是保留字，然后执行：

var selection = $('.dvData, .dvData1');

如果您需要别的东西，请告诉我。

为多个按钮应用1个JavaScript语法

2 个答案: