$(function() { var autoPrint = true, popupWidth = 500, popupHeight = 500, printWin = function(el) { var msg = el.parent().next('.block'), txt = el.text(), msgContent = msg.html(), pgtitle = el.parent().text().replace(txt,''), win = '<html><head><title>' + pgtitle + '</title>' + '<style>.donotprint,.print{display:none;}</style>' + '</head><body><div class=h><input onclick=window.print() type=button value=Print>' + '<input onclick=window.close() type=button value=Close><hr></div>' + msgContent + '</body></html>', temp = "menubar=yes,location=no,toolbar=0,status=0,scrollbars=1,width=" + popupWidth + ",height=" + popupHeight, w = window.open('', 'Print', temp); w.document.write(win); if (autoPrint) { w.print(); } }; $('a.print').click(function(){ printWin( $(this) ); return false; }); });
<h2 class="title">Paragraph 1 <a class="print" href="#">Print me</a></h2> <div class="block">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tortor libero, molestie ut tristique nec, elementum quis lorem. Aliquam erat volutpat. Vivamus dolor arcu, mattis ut volutpat ut, dignissim sit amet tortor. Fusce mollis rutrum sodales. Fusce et dignissim lectus. In arcu lorem, euismod nec rutrum non, rutrum sit amet est. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet placerat dolor. Nullam euismod hendrerit pharetra. Nunc nec mi vel nisl convallis placerat. Nulla facilisi. Ut interdum tristique magna eu pellentesque. Sed vel est in lorem cursus adipiscing. Vestibulum id mauris quis orci porttitor vehicula. <span class="donotprint">This sentence is hidden when the paragraph is printed.</span></div> <h2 class="title">Paragraph 2 <a class="print" href="#">Print me</a></h2> <div class="block">Nulla quis dui nibh, vitae rhoncus mauris. Integer arcu dolor, commodo nec fringilla tempor, pharetra et lorem. Praesent quis velit vel sem mollis dictum. Vivamus nisi enim, pulvinar non suscipit eu, lobortis sit amet velit. Donec scelerisque facilisis purus, id elementum sapien aliquam quis. Phasellus ut nunc sed risus molestie hendrerit id ac lacus. Morbi augue est, adipiscing eu gravida in, faucibus ac metus. Aenean vel velit ligula, sed auctor odio. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus eget lacus suscipit diam tempor ultrices. Donec tincidunt faucibus ante sed vestibulum. Duis dignissim, velit quis mollis pharetra, tellus diam viverra sem, quis bibendum urna metus quis enim. Mauris magna arcu, convallis nec imperdiet in, condimentum sed diam. Duis eu quam eu diam gravida sagittis eget et magna.</div> <h2 class="title">Paragraph 3 <a class="print" href="#">Print me</a></h2> <div class="block">Aliquam rutrum pretium laoreet. Donec at mauris et odio dignissim dignissim. Quisque aliquet metus sed turpis facilisis eu gravida est imperdiet. Donec ullamcorper diam a metus sodales nec dictum turpis suscipit. Nullam consectetur lacus eu nunc elementum nec malesuada justo convallis. In ac felis mauris. Morbi ac neque eu lectus sodales iaculis at a leo. In dui lorem, ultricies eu tincidunt et, pharetra vel orci. Curabitur dignissim, turpis eget interdum condimentum, nulla est vulputate neque, ut cursus risus eros vitae diam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque posuere, justo quis rhoncus venenatis, purus elit adipiscing arcu, ut sodales orci elit ac sem. Nulla sem odio, lobortis in mollis nec, bibendum quis nulla. Aenean justo leo, pulvinar quis convallis nec, dapibus eget orci. Maecenas rhoncus mattis gravida.</div> <h2 class="title">Paragraph 4 <a class="print" href="#">Print me</a></h2> <div class="block">Sed vehicula posuere diam, eu semper nisi posuere vitae. Quisque sodales mollis tellus ut volutpat. Sed et odio est. Integer consequat ultrices magna ut lacinia. Nam ante tortor, mattis eu luctus non, congue a purus. Nunc vel leo felis, sed faucibus dolor. Sed metus nisi, ultrices sed suscipit id, molestie in nunc. Donec at commodo tellus. Aenean erat nulla, pulvinar non ornare vel, iaculis rutrum magna. Cras in leo sem. Proin erat enim, ultrices sit amet vehicula ut, imperdiet a nisl. In dignissim nunc et turpis tempor accumsan.</div> <h2 class="title">Paragraph 5 <a class="print" href="#">Print me</a></h2> <div class="block">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam dictum lacus non quam scelerisque faucibus. Nam sem erat, tincidunt blandit mollis quis, pulvinar eu lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nullam vitae eleifend massa. Sed molestie feugiat velit, eu porttitor justo mattis et. Phasellus vehicula neque in nunc eleifend a pellentesque dolor adipiscing. In hac habitasse platea dictumst. Vivamus facilisis quam non erat sodales sagittis. Nulla facilisi. Curabitur vitae justo est. In ullamcorper suscipit sem, in laoreet erat venenatis ut.</div>
h2.title { font-size: 22px; } .block { margin-bottom: 10px; } /* use this class name to hide something while printing */ .donotprint { color: red; }