자바스크립트 iframe 내용만 출력
이건 내 코드입니다.
<script>
var body = "dddddd"
var script = "<script>window.print();</scr'+'ipt>";
var newWin = $("#printf")[0].contentWindow.document;
newWin.open();
newWin.close();
$("body",newWin).append(body+script);
</script>
<iframe id="printf"></iframe>
작동은 되는데 상위 페이지를 출력하는데 iframe만 출력하려면 어떻게 해야 하나요?
저는 그것이 효과가 있으리라고는 기대하지 않습니다.
대신 해 보다
window.frames["printf"].focus();
window.frames["printf"].print();
사용.
<iframe id="printf" name="printf"></iframe>
아니면 좋은 옛것을 시도해 보시기 바랍니다.
var newWin = window.frames["printf"];
newWin.document.write('<body onload="window.print()">dddd</body>');
newWin.document.close();
jQuery가 해킹할 수 없는 경우
document.getElementById("printf").contentWindow.print();
쉬운 방법(ie7+, firefox, Chrome, safari에서 테스트)은 이것일 것입니다.
//id is the id of the iframe
function printFrame(id) {
var frm = document.getElementById(id).contentWindow;
frm.focus();// focus on contentWindow is needed on some ie versions
frm.print();
return false;
}
적합할 수도 있고 그렇지 않을 수도 있지만 다음과 같은 경우에는 더 깨끗합니다.
iframe을 항상 페이지에서 인쇄하려면 iframe 이외의 모든 것을 숨기는 별도의 "@media print{}" 스타일시트를 사용할 수 있습니다.그러면 그냥 정상적으로 페이지를 출력하시면 됩니다.
다음 명령을 사용할 수 있습니다.
document.getElementById('iframeid').contentWindow.print();
이 명령어는 기본적으로 window.print()와 동일하지만 인쇄하고자 하는 창이 iframe에 있기 때문에 우선 해당 창의 인스턴스를 자바스크립트 객체로 얻어야 합니다.
따라서 iframe과 관련하여 먼저 iframe의 id를 사용하여 iframe을 얻은 다음 컨텐츠Window가 window(DOM) 객체를 반환합니다.따라서 이 객체에 window.print() 함수를 직접 사용할 수 있습니다.
IE8에서 위의 모든 솔루션에 문제가 있었고 IE 8+9, Chrome, Safari 및 Firefox에서 테스트된 괜찮은 해결책을 찾았습니다.상황에 맞게 동적으로 생성된 보고서를 인쇄해야 했습니다.
// create content of iframe
var content = '<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">'+
'<head><link href="/css/print.css" media="all" rel="stylesheet" type="text/css"></head>'+
'<body>(rest of body content)'+
'<script type="text/javascript">function printPage() { window.focus(); window.print();return; }</script>'+
'</body></html>';
본문 닫기 태그 전에 printPage() javascript 방법을 메모합니다.
다음으로 iframe을 만들어 해당 컨텐츠의 Windows를 사용할 수 있도록 상위 본문에 추가합니다.
var newIframe = document.createElement('iframe');
newIframe.width = '0';
newIframe.height = '0';
newIframe.src = 'about:blank';
document.body.appendChild(newIframe);
다음으로 내용을 설정합니다.
newIframe.contentWindow.contents = content;
newIframe.src = 'javascript:window["contents"]';
여기서는 동적 컨텐츠 변수를 iframe의 window 개체로 설정한 후 javascript: scheme을 통해 호출합니다.
마지막으로 인쇄하려면 iframe에 포커스를 맞추고 iframe 컨텐츠 내에서 javascript printPage() 함수를 호출합니다.
newIframe.focus();
setTimeout(function() {
newIframe.contentWindow.printPage();
}, 200);
return;
setTimeout은 꼭 필요한 것은 아니지만, 많은 양의 컨텐츠를 로드하는 경우 Chrome이 없으면 인쇄에 실패하는 경우가 종종 있으므로 이 단계를 권장합니다.또는 'newIframe.contentWindow.printPage()';를 캐치 시도에 래핑하고 setTimeout 래핑된 버전을 캐치 블록에 배치하는 방법도 있습니다.
여러 브라우저에서 잘 작동하는 솔루션을 찾는데 많은 시간을 할애했기 때문에 누군가에게 도움이 되기를 바랍니다.스페어 싸이클 덕분입니다.
편집:
setTimeout을 사용하여 printPage 함수를 호출하는 대신 다음을 사용합니다.
newIframe.onload = function() {
newIframe.contentWindow.printPage();
}
이때 iframe 내부에 스크립트 태그가 필요 없습니다.Chrome, Firefox, IE11 및 노드-웹킷 0.12에서 테스트됨:
<script>
window.onload = function() {
var body = 'dddddd';
var newWin = document.getElementById('printf').contentWindow;
newWin.document.write(body);
newWin.document.close(); //important!
newWin.focus(); //IE fix
newWin.print();
}
</script>
<iframe id="printf"></iframe>
모든 답변에 감사드립니다.
javascript를 이용하여 아이프레임의 내용을 설정하는 경우document.write()다음에 당신은 문서를 닫아야 합니다.newWin.document.close();그렇지 않으면 다음 코드는 작동하지 않고 인쇄는 I 프레임 내용만 인쇄하는 대신 전체 페이지 내용을 인쇄합니다.
var frm = document.getElementById(id).contentWindow;
frm.focus();// focus on contentWindow is needed on some ie versions
frm.print();
나는 이것을 타이프스크립트로 구현하려고 했지만, 위의 모든 것이 작동하지 않았습니다.텍스트 스크립트가 컨텐츠 창에 액세스할 수 있도록 하려면 먼저 요소를 캐스팅해야 했습니다.
let iframe = document.getElementById('frameId') as HTMLIFrameElement;
iframe.contentWindow.print();
IE9 이상의 경우 이 코드를 사용합니다.
window.frames["printf"].focus();
window.frames["printf"].print();
IE8의 경우:
window.frames[0].focus();
window.frames[0].print();
iframe 프린트를 하는 목적이 무엇인지 궁금합니다.
조금 전에 비슷한 문제가 있었습니다. 크롬의 인쇄 미리보기를 사용하여 iframe의 PDF 파일을 생성하는 것입니다.
결국 나는 속임수로 문제를 해결했습니다.
$('#print').click(function() {
$('#noniframe').hide(); // hide other elements
window.print(); // now, only the iframe left
$('#noniframe').show(); // show other elements again.
});document.getElementById('iframeid').contentWindow.print(); 이 코드는 테스트되고 작동하며 며칠이 지난 후에 실행됩니다.<iFrame 태그만 사용할 수 있고 <embed>를 피합니다. <object tag for pdf include.
언급URL : https://stackoverflow.com/questions/9616426/javascript-print-iframe-contents-only
'programing' 카테고리의 다른 글
| $ window.open에 인증 헤더를 추가하는 방법 (0) | 2023.10.26 |
|---|---|
| 선택 및 하드 코딩된 값을 포함한 SQL 삽입 (0) | 2023.10.26 |
| SQL 보기에 기본 키 추가 (0) | 2023.10.21 |
| ARM: 링크 레지스터 및 프레임 포인터 (0) | 2023.10.21 |
| Angular.js 매개 변수를 사용하여 리소스를 삭제 (0) | 2023.10.21 |