如何打印字符串中的HTML数据

时间:2014-09-12 08:37:29

标签: javascript

我的项目中有一个打印按钮。我正在使用JavaScript来打印数据。我有一个变量data_to_print,其中包含要打印的HTML。问题是,当我点击打印按钮时,窗口的打印对话框窗口无法打开。我无法找到问题,任何人都可以帮助我。 以下是我的代码:

function print_all()
{ 
var xx='<html>
    <head>
        <style>...</style>
    </head>
    <body>
        <center>
            <div>
                <table><thead>
                     <tr>
                        <th>Id</th>
                        <th>Name</th>
                        <th>Address</th>
                        <th>DOB</th>
                     </tr><thead>
                     <tr>
                        <td>1</td>
                        <td>John</td>
                        <td>Mumbai</td>
                        <td>15 August</td>
                     </tr>
                     <tr>
                        <td>2</td>
                        <td>John2</td>
                        <td>Mumbai2</td>
                        <td>18 August</td>
                     </tr>
                 </table>
            </div>
        </center>
    </body>
<html>';



var content_vlue = xx;
content_vlue=content_vlue.replace("[Print]", "");
var docprint=window.open("","","");
docprint.document.open();
docprint.document.write('<html><head>');
docprint.document.write('<style> .table{border-collapse:collapse;}.table tr 
th{border:1px solid #000!important;color:#000;}.table tr th  
a{color:#000!important;}.table tr td{border:1px solid #000!important;}</style>');
docprint.document.write('</head><body><center>');
docprint.document.write('<div align="left">');
docprint.document.write(content_vlue);
docprint.document.write('</div>');
docprint.document.write('</center></body></html>');
docprint.document.close();
docprint.focus();
}

1 个答案:

答案 0 :(得分:1)

您遇到麻烦的原因很简单。您忘记添加方法.print();

当我理解你的权利时,请遵循:

function print_all()
{
  ...
  docprint.document.close();
  docprint.focus();
  //This line was missing
  doc.print();
}

Addationaly两个建议:

首先:

正如steo所写,如果你想在Javascript中打印长字符串,请用加号来连接它。浏览器不接受字符串中的换行符。

第二

当我使用您的链接<a title="Print" onClick="print_all();" class="no-bord btnlite" target="_blank">print</a>的定义时,它确实在新选项卡中打开了开启页面。当我在IE中打开网站时,我们的另一个影响。效果:他没有将此行标记为可点击链接。

要解决这些问题,请使用此行<a title="Print" href="#" onClick="print_all();return false;" class="no-bord btnlite" target="_blank">print</a>