Я не могу написать код для вас прямо сейчас, но я могу поставить вас на правильный путь ..
Вам нужно использовать jquery, чтобы получить содержимое, которое вы хотите напечатать (вероятно, $('body').html();), затем создать всплывающее окно модального div и добавить iframe в модальный div. Затем добавьте в тело iframes (через $('iframe').document.body.append();) содержимое для печати. Затем вызовите print в iframe ($('iframe').window.print;)
Дайте мне знать, если это имеет смысл?
РЕДАКТИРОВАТЬ : Вот пример кода, работающего с тем, что, я полагаю, вы хотите. (убедитесь, что вы включили jquery перед этим кодом javascript)
<body>
<script>
$(document).ready(function(){
$('#printmodal').click(function(){
// variables
var contents = $('#printable').html();
var frame = $('#printframe')[0].contentWindow.document;
// show the modal div
$('#modal').css({'display':'block'});
// open the frame document and add the contents
frame.open();
frame.write(contents);
frame.close();
// print just the modal div
$('#printframe')[0].contentWindow.print();
});
});
</script>
<style>
#modal {
display: none;
width: 100px;
height: 100px;
margin: 0 auto;
position: relative;
top: 100px;
}
</style>
<!-- Printable div (or you can just use any element) -->
<div id="printable">
<p>This is</p>
<p>printable</p>
</div>
<!-- Print link -->
<a id="printmodal" href="#">Print Me</a>
<!-- Modal div (intially hidden) -->
<div id="modal">
<iframe id="printframe" />
</div>
</body>
jsfiddle: http://jsfiddle.net/tsdexter/ke2rqt97/