Как распечатать страницу с сохраненным css в ruby on rails?

#javascript #css #printing #ruby-on-rails-3.2

#javascript #css #печать #ruby-on-rails-3.2

Вопрос:

введите описание изображения здесьЯ использую приложение ruby-on-rails-3.2, пытаясь распечатать страницу, но когда она печатается, в ней нет css. Вот мой код

    <%= link_to("Print this Page", "#", :onclick =>"PrintElem('.PrintElem','News Details')") %>


    function PrintElem(news_heading, reporters_details, full_news_text, title)
    {
    heading = jQuery('head').html();
    body_data = jQuery('body').html();
    Popup(heading, body_data);
    return true;
    }

    function Popup(news_heading, body_data)
    {//start
    // var mywindow = window.open('','printwindow');
    mywindow = window.open('#','printing','height=900,width=900,scrollbars=1');
    mywindow.document.write('<html><head>' heading '</head><body onload="window.print();">');
    mywindow.document.write(body_data);
    mywindow.document.write('</body></html>')
    mywindow.onload = function() { mywindow.print(); }
    mywindow.document.close();
    return true;
    //end
    }
 

Здесь проблема в том, что страница печатается перед загрузкой javascripts и css. Эта страница должна быть распечатана после загрузки всех javascript и css. Заранее спасибо.

Комментарии:

1. Что не отображается при печати? Цвета? Недавно я создал биллинговую систему php, и chrome, например, по умолчанию удаляет некоторые правила css при печати!

2. Да, Ален, я хочу цветную печать.

Ответ №1:

Попробуйте создать документ с использованием css и javacstcipt в основном

 <html>
<head>
//Your css
//Your scripts
</head>
<body>
</dody>
</html>
 

Затем откройте

 window.open('/somefile.html', 'Yout Title maybe from the document', 'width=900');
 

Затем используйте jQuery для заполнения фиктивной страницы печати (область тела);

 $(body).prepend(body_data);
 

Возможно, вы неправильно загружаете css и javascript при написании всего html после загрузки страницы с помощью javascript.

Имейте в виду, что вам нужны некоторые правила css для правильной печати страниц (цвета, стили)

 -webkit-print-color-adjust:exact; // For chrome browser
 

Скажите мне, работает ли это для вас!

Комментарии:

1. Пожалуйста, смотрите скриншот, когда я нажимаю Распечатать, он открывается, как на скриншоте выше. Перед загрузкой javascript.

2. Я понимаю, но зачем создавать другой html-код и заполнять его данными со старой страницы, когда у вас может быть кнопка для открытия window.print и оформите то, что вы хотите показать, и то, что вы не хотите показывать, с помощью @ media print{} скрыть все меню и элементы документа, которые вы не хотитехотите распечатать с отображением none внутри @ media