2015-01-26 3 views
1

На моем веб-сайте я хотел бы создать кнопки для печати различных изображений. Я знаю, что это может быть достигнуто с помощью Javascript. После некоторых исследований я написал следующее:Распечатать изображение в Chrome с помощью Javascript

<script type="text/javascript"> 
var pwin; 
function printImg(imgSrc) { 
    pwin = window.open(imgSrc, "_blank"); 
    setTimeout("pwin.print()", 20); 
} 
</script> 
... 
<input class="printAndSolve" type="submit" value="Print" 
onclick="printImg('original.png')"> 

Это открывает изображение на новой вкладке, но не отображает диалоговое окно печати. Что я сделал не так?

Дальнейшие исследования привели к другому подходу:

<script type="text/javascript"> 
function printImg(imgSrc) { 
    var printWindow = window.open('', 'Print 
    Window','height=400,width=600'); 
    printWindow.document.write('<html><head><title>Print Window</title>'); 
    printWindow.document.write('</head><body ><img src=\''); 
    printWindow.document.write(imgSrc); 
    printWindow.document.write('\' /></body></html>'); 
    printWindow.document.close(); 
    printWindow.onload = function() { printWindow.print(); }; 
} 
</script> 
... 
<input class="printAndSolve" type="submit" value="Print" 
onclick="printImg('original.png')"> 

Это дает мне странный результат. При попытке распечатать небольшое изображение открывается диалоговое окно печати. Но когда я пытаюсь напечатать более крупное изображение (охватывающее всю бумагу формата А4), диалог НЕ появляется. Что происходит?

Принимая во внимание то, что я хочу достичь, что бы вы сказали, это лучший подход?

Заранее благодарен!

EDIT

Это на самом деле, как представляется, проблема, связанная с браузером. Этот код работает отлично в Firefox и IE. У меня проблема, потому что я разрабатываю веб-сайт в Chrome. Очевидно, Chrome не дожидался загрузки моего окна, прежде чем показывать окно печати. Другие браузеры, похоже, сначала дождались загрузки контента, а затем отобразили окно печати. Я, конечно, пробовал с функцией setTimeout без успеха. Мой вопрос, таким образом, может ли кто-нибудь показать мне обходной путь для печати изображений в Chrome?

решаемые

Этот сайт оказался золотым: http://nice-tutorials.blogspot.se/2014/01/image-printing-problem-in-google-chrome.html

Проблема решена!

ответ

0

Решение, чтобы добавить событие OnLoad для тела тега:

printWindow.document.write('</head><body onLoad="self.print(); self.close()"><img src=\''); 
Смежные вопросы