打印div内容时出错

Question

嗨，大家好，我正在使用此jQuery函数来打印div内容。 第一次显示/打印空白页。 但是第二次它有效。 它在console.log()显示div内容，但不打印这些内容。

我试图找出问题，但坚持下去。 请帮忙

提前致谢。

jQuery.fn.LBCprint = function()
{
    var jStyleDiv = '';
    var strFrameName = ("printer-" + (new Date()).getTime());
    var jFrame = $("<iframe name='"+strFrameName+"'>");
    jFrame.css("width", "1px").css("height", "1px").css("position", "absolute").css("left", "-9999px").appendTo($("body:first"));

    // Get a FRAMES reference to the new frame.
    var objFrame = window.frames[strFrameName];

    // Get a reference to the DOM in the new frame.
    var objDoc = objFrame.document;

    jStyleDiv = $("<div>").append(
        $("style").clone()
    );

    objDoc.open();
    objDoc.write("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">");
    objDoc.write("<html>");
    objDoc.write("<head>");
    objDoc.write("<title>");
    objDoc.write(document.title);
    objDoc.write("</title>");
    objDoc.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com/n/css/main_style_print.css\" />");
    objDoc.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com/n/css/dashboard.css\" />");
    objDoc.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com/assets/css/pagination.css\" />");
    objDoc.write("</head>");
    objDoc.write("<body>");
    objDoc.write(jStyleDiv.html());
    objDoc.write(this.html());
    objDoc.write("</body>");
    objDoc.write("</html>");
    objDoc.close();

    // Print the document.
    objFrame.focus();
    objFrame.print();

    jStyleDiv = '';

    setTimeout(function(){
        jFrame.remove();
    }, (10000));
}

Answer 1

您可以尝试以下方法：

    html = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">";
    html += "<html>";
    html += "<head>";
    html += "<title>";
    html += document.title;
    html += "</title>";
    html += "<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com/n/css/main_style_print.css\" />";
    html += "<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com/n/css/dashboard.css\" />";
    html += "<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com/assets/css/pagination.css\" />";
    html += "</head>";
    html += "<body>";
    html += jStyleDiv.html();
    html += this.html();
    html += "</body>";
    html += "</html>";

    objDoc.open();
    objDoc.write(html);
    objDoc.close();

Answer 2

您的代码替换后对我来说很好

// Print the document.
objFrame.focus();
objFrame.print();

与

// Print the document.
objFrame.onload = function(){
    objFrame.focus();
    objFrame.print();
    jFrame.remove();
};

我想您的框架有时在打印时无法渲染。

Answer 3

我采用了这种简单的方法，您可以使用$而不是jQuery来简化所有操作，以免发生冲突。 我只是打印身体内容。

$.fn.LBCprint = function()
{
 var jStyleDiv = '';
 var strFrameName = ("printer-" + (new Date()).getTime());
 var jFrame = $("<iframe name='"+strFrameName+"'>");
 jFrame.css("width", "1px").css("height", "1px").css("position", 
 "absolute").css("left", "-9999px").appendTo($("body:first"));

 // Get a FRAMES reference to the new frame.
 var objFrame = window.frames[strFrameName];

 // Get a reference to the DOM in the new frame.
 var objDoc = objFrame.document;

 jStyleDiv = $("<div>").append(
    $("style").clone()
 );

objDoc.open();
objDoc.write("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\"  
              \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">");
objDoc.write("<html>");
objDoc.write("<head>");
objDoc.write("<title>");
objDoc.write(document.title);
objDoc.write("</title>");
objDoc.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com
              /n/css/main_style_print.css\" />");
objDoc.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com
             /n/css/dashboard.css\" />");
objDoc.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"https://www.abc.com
              /assets/css/pagination.css\" />");
objDoc.write("</head>");
objDoc.write("<body>");
objDoc.write(jStyleDiv.html());
objDoc.write(document.body.innerHTML);
objDoc.write("</body>");
objDoc.write("</html>");
objDoc.close();

// Print the document.
objFrame.focus();
objFrame.print();

jStyleDiv = '';

setTimeout(function(){
    jFrame.remove();
}, (10000));
}

这是小提琴

打印div内容时出错

问题描述

3 个解决方案

解决方案1
0 2014-08-27 15:10:41

解决方案2
0 已采纳 2014-08-27 16:19:38

解决方案3
0 2014-08-27 17:40:49

打印div内容时出错

问题描述

3 个解决方案

解决方案1 0 2014-08-27 15:10:41

解决方案2 0 已采纳 2014-08-27 16:19:38

解决方案3 0 2014-08-27 17:40:49

解决方案1
0 2014-08-27 15:10:41

解决方案2
0 已采纳 2014-08-27 16:19:38

解决方案3
0 2014-08-27 17:40:49