Печать содержимого, загруженного с сервера

Question

Я загружаю картинку с сервера JS после загрузки всей страницы. Значит, пользователь нажимает, я загружаю какое-то изображение и вставляю его в DOM.

Это изображение имеет уникальный идентификатор, теперь я хочу распечатать это изображение ТОЛЬКО с помощью JS. Я сделал файл стиля для печати

* {
    display:none;
    visibility: none;
}
html, body, #out_image_1 {
    background: none;
    display: block !important;
    left: 0px;
    margin: 0px;
    padding: 0px;
    position: relative;
    top: 0px;
}

и вызов печати такой

$("#print-button2").click(function() {
    window.print();
    return false;
})

но страница пуста (пуста) Где я не прав?

Спасибо

Answer 1

Есть несколько причин, по которым он может не печататься.

• Ваше изображение может содержаться в другом элементе, но, согласно вашему CSS, родительский элемент по-прежнему display:none

  Ваш CSS будет работать, только если #out_image_1 является прямым потомком body:
  http://jsfiddle.net/RXMx8/

  Но нет, если #out_image_1 имеет какие-либо родительские элементы, кроме body и html:
  http://jsfiddle.net/RXMx8/1/

Могу поспорить, что это проблема, но могут быть и другие причины:

• Ваш браузер не настроен на печать изображений по умолчанию. Использование window.print() может пропустить «предварительный просмотр», что позволит включить этот параметр.

• Ваш HTML в порядке, но вы нацелены не на тот элемент.

• У вас закончились чернила; )

Даже если вы добавляете элемент с помощью javascript, вы все равно сможете его распечатать. Для отладки удалите * { display:none; } и посмотрите, что получится.

^{* Кстати, должно быть visibility: hidden;; «none» не является допустимым значением, но оно все равно избыточно с display:none, поэтому вам оно вообще не нужно.}