如何使用 jquery 打印动态 div html 元素答案

【问题标题】：How to print a dynamic div html element using jquery如何使用 jquery 打印动态 div html 元素
【发布时间】：2011-09-30 08:57:41
【问题描述】：

我试图使用 printElement() 函数打印动态 div html 元素，但是当我遇到问题时......我的代码如下

$("#btnPrint").click(function () {
                if (ImgPath != '') {
                    sHtml = "<div id='dvPrint'><table>";
                    sHtml += "<tr><td>" + "<img src='" + ImgPath + "' border='0'/>" + "</td></tr>";
                    sHtml += "<tr><td>" + $('#lblTxt').html() + "</td></tr>";
                    sHtml += "</table></div>";
                    alert($('#dvPrint').html());
                       $("#element").printElement('#dvPrint');
                }
                else {
                    alert("Image not found for print");
                }
                return false;
            });

当我提醒alert($('#dvPrint').html()); 时，它什么也没有显示。那么 printElement() 如何工作。我可以将我的动态 div 附加到正文中......我只需要生成 div 并通过 jquery 打印其中的内容......我需要帮助。谢谢

【问题讨论】：

标签： jquery

【解决方案1】：

您只是格式化了 html 字符串，并没有将其附加到 DOM。您无法使用$('#dvPrint') 找到它。使用$(sHtml).html() 获取格式化的html。

因此打印结果将是：$(sHtml).printElement();

$("#btnPrint").click(function () {
    if (ImgPath != '') {
        sHtml = "<div id='dvPrint'><table>";
        sHtml += "<tr><td>" + "<img src='" + ImgPath + "' border='0'/>" + "</td></tr>";
        sHtml += "<tr><td>" + $('#lblTxt').html() + "</td></tr>";
        sHtml += "</table></div>";
        var $dvPrint = $(sHtml);
        alert($dvPrint.html());
        $dvPrint.printElement();
    }
    else {
        alert("Image not found for print");
    }
    return false;
});

【讨论】：

您的代码运行良好....谢谢。我还需要一个帮助。在图像标签中，我指定高度和宽度，例如但是当图像打印时，实际高度和宽度明智不是打印，而是打印与我给定的高度和宽度相比非常小。我需要你的帮助怎么办？
如果你的图片不是那么大，你可以忽略这些属性。否则，您可以使用 jquery 在img 中预加载图像，然后获取图像大小。这是示例：stackoverflow.com/questions/799710/get-image-width-and-height

【解决方案2】：

警报($('#dvPrint').html());在您像这样打印 sHtml 之前不会工作：$('#dvPrint').html(sHtml) - 这会将 sHtml 中的所有内容放到 dvPrint 中。

【讨论】：

在图像标签中我指定高度和宽度，如但是当图像是然后打印实际高度和宽度，它不打印，而是打印与我给定的高度和宽度相比非常小。我需要你的帮助怎么办？
我真的不是很明白。你把这个：使用 javascript 到某个变量，然后像我在上一条消息中显示的那样打印它打印的图片不是给定尺寸的吗？您是否尝试过转义引号？例如：var image = ''。但可能是我不明白这个问题..

【解决方案3】：

我更喜欢使用 dom 创建一个 div

var newdiv = document.createElement('div');

然后在 jQuery 中使用它

$(newdiv).html("<table>.....</table>");

或使用 DOM 的接口 (.addNode()) 问候

【讨论】：