使用内联脚本html数据附加html数据并进行打印

时间:2014-11-18 05:17:35

标签: javascript jquery html

我需要在脚本中添加带有html的表数据。并附加打印数据

但此处的表格数据仅显示在打印模式中。

HTML

 <div>
    <p>Your content here</p>
    <table  id="toPrint">
     <tr>
    <td>Neil D'zousa</td>
    <td>112233445566</td>
    </tr>
</table>
</div>
<div id="notForPrint">
    <a href="#" id="print">print</a>
</div>

脚本

function open() {
 var w = window.print();
 var htmlTable2 = '<tr>' + '<th>Name</th>'
              + '<th>Phone</th>'+ '</tr>';
    var html = $("#toPrint").html();
    var t=html;
    $(t).append(htmlTable2);
    $(w.document.body).html(t);
}
$(function() {
    $("a#print").click(open);
});

如果有人知道这一点,请分享您的答案。

关于......

2 个答案:

答案 0 :(得分:1)

Demo

var htmlTable2 = '<tr>' + '<th>Name</th>'
          + '<th>Phone</th>'+ '</tr>';
var html1 = $("#toPrint").append(htmlTable2);
var t=html1;
$(t).append(htmlTable2);
window.print(); 

试试这个。我用铬测试过。它工作正常

编辑:    回复你的请求:你必须查看dom [name等]是否已经[重新发送

$('#domHeader').length > 0 means already present.

if(! $('#domHeader').length)
{
 var htmlTable2 = '<tr>' + '<th>Name</th>'
          + '<th>Phone</th>'+ '</tr>';
 var html1 = $("#toPrint").prepend(htmlTable2); //peter is correct
 //var t=html1;
 //$(t).append(htmlTable2);
}

EDITED DEMO

UPDATE FINAL

答案 1 :(得分:1)

以下应该这样做。标题应位于顶部:

function open() {

     var htmlTable2 = '<tr><th>Name</th><th>Phone</th></tr>';
     var html1 = $("#toPrint").prepend( htmlTable2 );

     window.print(); 
}

其余代码应该可以正常工作。