iframe.print против window.print в IE - маленький шрифт в прежнем

Question

В нашем веб-приложении у нас есть функция печати для нескольких наших страниц, и мы используем подход, заключающийся в том, чтобы поместить содержимое текущей страницы в глобально доступный документ iframe и распечатать iframe (используя Javascript). Это прекрасно работает в Firefox, но в IE он печатает iframe очень маленьким шрифтом, почти не читаемым.

Все CSS, применяемые в обоих браузерах, одинаковы, я гарантировал, что печатаемый HTML-код никоим образом не переполняется (что делает IE подходящим для содержимого или чего-то в этом роде) ... и, тем не менее, печать IE очень мала. Интересно, что если я изменяю логику печати для записи в новое окно, а затем выполняю window.print (), все отлично работает и в IE, и шрифт настолько большой, насколько это требуется / определяется CSS.

Кто-нибудь сталкивался с подобной проблемой с iframe.print () в IE?

Спасибо за помощь.

Нитин

Answer 1

Я нашел эту тему после того, как решил ту же проблему. Похоже, такое поведение сохраняется даже в IE11. Хорошей новостью является то, что я смог найти решение, не прибегая к открытию нового окна и затем вызывая window.print().

Хитрость заключается в том, чтобы использовать document.execCommand в IE (работает вплоть до IE11) и изящно отступать до iframe.print() в других браузерах. Полное решение может выглядеть примерно так (используя jQuery для выбора iframe, но это совершенно необязательно):

var target = $('iframe')[0];
try {
    target.contentWindow.document.execCommand('print', false, null);
} catch(e) {
    target.contentWindow.print();
}

Это решение было вдохновлено очень старой веткой об IE7 отсюда: http://bytes.com/topic/misc/answers/629926-ie7-printing-iframe-solution. Это все еще актуально.

Answer 2

Сегодня у меня был мелкий шрифт по IE, и чтобы исправить, я просто настроил свою функцию печати так:

$(document).ready(function(){
$("#printFrame").click(function(){    
    if (document.queryCommandSupported('print')) 
    {
        $("#iframe").get(0).contentWindow.document.execCommand('print', false, null);
    } 
    else 
    {
        $("#iframe").get(0).contentWindow.focus();
        $("#iframe").get(0).contentWindow.print();
    }
  });
});

Теперь кажется, что то же самое можно распечатать на IE, Chrome и Firefox. Написал здесь, потому что мне было трудно найти это решение, так что, надеюсь, это кому-нибудь поможет.

Answer 3

Да, мы видим то же самое. Если мы откроем ту же страницу напрямую, она будет напечатана так, как вы ожидаете. Когда он загружается в iframe и печатается, он делает все меньше; не только шрифт.

Используется IE9 в Windows 7.

Answer 4

Как писал "Heston Liebowitz", использование "execCommand" является хорошей идеей и решением. Но я бы установил условие if для IE, потому что эта проблема возникает только в случае IE. Ниже мое предложение:

// Get the iframe element
var oIFrame = $('#iF_Print').get(0);
// Fix for IE : Allow it to render the iframe
oIFrame.focus();

var bMS_IE = false;
// Verify whether the browser is Internet Explorer (IE8,IE9,IE10 -> "msie", but for IE11 the name is changed into "trident").
var userAgent = window.navigator.userAgent.toLowerCase();
bMS_IE = ( (userAgent.indexOf('msie ') > -1) || (userAgent.indexOf("trident/") > -1) )?true:false;

if ( bMS_IE ) {
        try {
            oIFrame.document.execCommand('print', false, null);
        }catch(e) {
            window.print();
        }
}else {
    oIFrame.print();
}

Answer 5

Конечным решением, которое я принял, было использование window.print () вместо iframe.print ().