Javascript Распечатать только содержание 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?
Ответы
Ответ 1
Я бы не ожидал, что это сработает
попробуйте вместо этого
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 не может взломать его
Live Demo
Ответ 2
document.getElementById("printf").contentWindow.print();
Применяется та же политика происхождения.
Ответ 3
Простой способ (проверенный на 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;
}
Ответ 4
альтернативный вариант, который может быть или не быть подходящим, но более чистым, если он:
Если вы всегда хотите просто распечатать iframe со страницы, вы можете иметь отдельную таблицу стилей @media print {}, которая скрывает все, кроме iframe. Затем вы можете просто распечатать страницу в обычном режиме.
Ответ 5
Вы можете использовать эту команду:
document.getElementById('iframeid').contentWindow.print();
Эта команда в основном такая же, как window.print(), но поскольку окно, которое мы хотели бы распечатать, находится в iframe, сначала нужно получить экземпляр этого окна в качестве объекта javascript.
Итак, ссылаясь на этот iframe, мы сначала получаем iframe, используя его id, а затем он contentWindow возвращает объект окна (DOM). Таким образом, мы можем напрямую использовать функцию window.print() для этого объекта.
Ответ 6
У меня были проблемы со всеми вышеперечисленными решениями в 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>';
Обратите внимание на метод javascript printPage() перед тегом закрытия тела.
Затем создайте iframe и добавьте его в родительское тело, чтобы его содержимое было доступно:
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, а затем вызываем ее через схему javascript:.
Наконец, для печати; сфокусируйте iframe и вызовите функцию javascript printPage() в содержимом iframe:
newIframe.focus();
setTimeout(function() {
newIframe.contentWindow.printPage();
}, 200);
return;
SetTimeout необязательно необходимо, однако, если вы загружаете большое количество контента, я обнаружил, что Chrome иногда не печатался без него, поэтому этот шаг рекомендуется. Альтернативой является wrap 'newIframe.contentWindow.printPage();' в try catch и поместите завершенную версию setTimeout в блок catch.
Надеюсь, это поможет кому-то, поскольку я потратил много времени на поиск решения, которое хорошо работало в нескольких браузерах. Благодаря SpareCycles.
EDIT:
Вместо использования функции setTimeout для вызова функции printPage используйте следующее:
newIframe.onload = function() {
newIframe.contentWindow.printPage();
}
Ответ 7
В это время нет необходимости в теге script внутри iframe. Это работает для меня (проверено в Chrome, Firefox, IE11 и node -webkit 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>
Спасибо всем, спасите мой день.
Ответ 8
Если вы устанавливаете содержимое IFrame с помощью javascript document.write()
, тогда вы должны закрыть документ newWin.document.close();
, иначе следующий код не будет работать, и печать напечатает содержимое всей страницы, а не только содержимое IFrame.
var frm = document.getElementById(id).contentWindow;
frm.focus();// focus on contentWindow is needed on some ie versions
frm.print();
Ответ 9
Используйте этот код для IE9 и выше:
window.frames["printf"].focus();
window.frames["printf"].print();
Для IE8:
window.frames[0].focus();
window.frames[0].print();
Ответ 10
Я застрял, пытаясь реализовать это в машинописи, все вышеперечисленное не будет работать. Я должен был сначала привести элемент, чтобы машинопись имела доступ к contentWindow.
let iframe = document.getElementById('frameId') as HTMLIFrameElement;
iframe.contentWindow.print();
Ответ 11
Мне интересно, какова ваша цель делать печать iframe.
Я встретил аналогичную проблему минуту назад: используйте предварительный просмотр хрома для создания PDF файла iframe.
Наконец, я решил свою проблему с трюком:
$('#print').click(function() {
$('#noniframe').hide(); // hide other elements
window.print(); // now, only the iframe left
$('#noniframe').show(); // show other elements again.
});