개발 이야기/Javascript & jQuery
[JavaScript] 인쇄할 내용을 객체로 만들어서 프린트하기
강한페페
2020. 1. 30. 16:22
반응형
$(document).ready(function(){
$("#print_btn").on("click", function(){
const completeParam = makeHtml(app_idx); //app_idx : DB에서 불러온 인덱스(상황에 따라 변경)
reportPrint(completeParam);
});
});
//인쇄할 내용을 객체화시킴
function makeHtml(app_idx){
const obj = {html : ''};
let html = '<div class="pagewrap"><div class="print_bg"><img src="image/print_bg.jpg" alt=""></div><div class="page">';
html += '<span class="num">' + "No." + app_idx + '</span>';
html += '<h1>인쇄할 내용</h1>';
html += '</div>';
obj.html = html;
return obj;
}
//실제 인쇄창 팝업
function reportPrint(param){
const setting = "width=850, height=1100";
const objWin = window.open('', 'print', setting);
objWin.document.open();
objWin.document.write('<html><head><title>인쇄할 내용</title>');
objWin.document.write('<link rel="stylesheet" type="text/css" href="css/print.css"/>');
objWin.document.write('</head><body>');
objWin.document.write(param.html);
objWin.document.write('</body></html>');
objWin.focus();
objWin.document.close();
//브라우저별로 윗 소스가 실행되기 전에 마무리지어버리는 경우가 있으므로 시간여유를 줌
setTimeout(function(){objWin.print();objWin.close();}, 1000);
}반응형