如何使用 JQuery 进行打印答案

【问题标题】：How can I print using JQuery如何使用 JQuery 进行打印
【发布时间】：2017-09-21 22:13:37
【问题描述】：

我有嵌套的 divs..其中图像动态生成...这是 html 代码..我的问题是如果我单击打印按钮需要打印相应的图像。

<div id="outputTemp" style="display:none">
<div id="rightoutputimgae">
<div id="rightimgId" class="rightimg"  rel="tooltip" content="
 <img src='jqe13/image/1.jpg' class='tooltip-image'/> ">
<div id="outputimageId" class="outputimage">
   <img src="jqe13/image/1.jpg" alt="Right Bottom Image"></div>
 </div>
 <ul>
 <li id="outcheckbox"><input name="outCheck" type="checkbox"></li>
<li id="outedit">
  <a href="#"><img src="jqe13/image/edit_s.PNG" alt="edit" title="Edit">
  </a></li>
<li id="outdelete"><a href="#" onclick="deleteImg(div11)">
<img src="jqe13/image/delet_c.PNG" alt="delete" title="Delete"></a></li>
<li id="outfullscreen">
<a href="#">
<img src="jqe13/image/fullscreen_c.PNG" alt="Full Screen" class="fullscreen" 
  title="Full Screen"></a></li>
 <li id="outshare">
 <a href="#"><img src="jqe13/image/share_c.PNG" alt="Share" title="Share"></a>
 <div id="menu">
 <div id="tooltip_menu">
<a href="#" class="menu_top" id="email">
<img src="jqe13/image/email.PNG" alt="Email" title="Email"></a>
<a href="#" onClick="postToFeed()" class="facebook"><img src="jqe13/image/fb.PNG" 
alt="Facebook" title="Facebook"></a>
<a href="#" id="twitter">
<img src="jqe13/image/twitter.png" alt="Twitter" title="Twitter"></a>
<a href="#" class="menu_bottom" id="save">
 <img src="jqe13/image/save.PNG" alt="Save" title="Save"></a>
 </div>
 </div>
 </li>
 <li id="outprint"><a href="#">
 <img src="jqe13/image/print.PNG" class="printMe" alt="Print" title="Print"></a>
   </li>
 </ul>
  </div>

当我点击打印按钮时，我需要打印图像..

我如何编写 jquery 函数来打印图像..

【问题讨论】：

你把标题广告花式框，你问印刷问题..？？
哎呀......我想问两个
好的 NP 我已经编辑了问题'
thanx..你能帮我吗？

标签： javascript jquery

【解决方案1】：

试试看

$('.printMe').click(function(){
     window.print();
});

或者如果您想打印选定区域，请尝试

$('.printMe').click(function(){
     $("#outprint").print();
});

【讨论】：

实际上.. 不是要打印整个网页..

是的..outputimageid 是我有图像的 div id..我可以替换媒体打印块中的 div id

这完全行不通... window.print() 单独工作

未捕获的类型错误：$(...).print 不是函数

对我来说同样的问题：Uncaught TypeError: $(...).print is not a function

【解决方案2】：

嘿，如果你想打印选定的区域或 div，试试这个。

<style type="text/css">
@media print
{
body * { visibility: hidden; }
.div2 * { visibility: visible; }
.div2 { position: absolute; top: 40px; left: 30px; }
}
</style>

希望对你有帮助

【讨论】：

【解决方案3】：

function printResult() {
    var DocumentContainer = document.getElementById('your_div_id');
    var WindowObject = window.open('', "PrintWindow", "width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes");
    WindowObject.document.writeln(DocumentContainer.innerHTML);
    WindowObject.document.close();
    WindowObject.focus();
    WindowObject.print();
    WindowObject.close();
}

【讨论】：

【解决方案4】：

有一个jquery print area。我已经使用了一段时间了。

$(".printMe").click(function(){
   $("#outprint").printArea({ mode: 'popup', popClose: true });
});

【讨论】：