Question

如何使用javascript正确复制/克隆html表并将其提交给php，它将转换为PDF和XLS文档？

到目前为止，我有一个像这样的HTML：

<table class="planning-table">
    <thead>
        <tr>
            <td>blah blah</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>blah blah</td>
        </tr>
    </tbody>
</table>

<form id="exportPDFform" method="post">
    <a href="#exportPDF" id="exportPDF">Eksport</a>
    <input id="table_data" type="hidden" name="table" value="" />
</form>

和jquery：

$("#exportPDF").on("click", function (){
    var value = $('.planning-table').clone();
    $("#table_data").val( escape( value ) );
    $("#exportPDFform").submit();
    return false;
});

现在，克隆工作，但是，当放入输入字段时，它给了我：

[object-Object]

我如何正确地做到这一点？

PS：在选择不同的过滤器时，表单会被动态更改/创建，因此使用最终产品然后在PHP端重新创建它会更容易。

Answer 1

大概escape()接受一个字符串，而你提供一个jQuery对象。当您尝试将对象强制转换为字符串时，javascript会为您提供"[object Object]"。相反，您需要检索表的HTML值，如下所示：

var value = $('.planning-table').clone().wrap('<div />').parent().html();

Answer 2

我认为您不想使用Clone（）函数，而是我想要获取元素的HTML内容，但在表格上方的元素上使用.html（）函数。

<div id="table-container">
<table class="planning-table">
    <thead>
        <tr>
            <td>blah blah</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>blah blah</td>
        </tr>
    </tbody>
</table>
</div>

<form id="exportPDFform" method="post">
    <a href="#exportPDF" id="exportPDF">Eksport</a>
    <input id="table_data" type="hidden" name="table" value="" />
</form>

和

$("#exportPDF").on("click", function (){
    var value = $('#table-container').html();
    $("#table_data").val( escape( value ) );
    $("#exportPDFform").submit();
    return false;
});

克隆全表并提交为表单值

2 个答案: