Как вы печатаете из всплывающего окна в javascript?

У меня есть приложение .Net, которое динамически создает небольшую HTML-страницу и вытаскивает ее в новом окне с использованием метода javascript document.open. Все с этой функциональностью работает нормально.Как вы печатаете из всплывающего окна в javascript?

Теперь я хочу добавить кнопку на страницу HTML, которая печатает страницу. Я попытался, используя следующий код, чтобы не дало никаких результатов:

<a href='print.html' onClick='window.print();return false;'> 
<img src='images/printer.png' height='32px' width='32px'></a>

При нажатии на кнопку в всплывающем окне, ничего не происходит. Но когда исходный код этой страницы сохраняется и загружается в браузере как отдельная страница, кнопка печати работает отлично. ~~Таким образом, похоже, что проблема связана с тем, что код находится во всплывающем окне.~~ [Проблема теперь в том, что код написан во всплывающем окне после его открытия.] Кто-нибудь знает способ исправить эту проблему или любые альтернативы?

EDIT:

Другой метод, который я пытался с теми же результатами:

<input type='button' onclick='window.print()' value='Print' />

<a href='javascript:window.print()'> 
<img src='images/printer.png' height='32px' width='32px'></a>

EDIT СНОВА:

Приведенный выше код работает в Firefox, но не в IE7. Любые идеи по работе для IE?

EDIT еще раз повторил:

Вот тест, используя код, который npup posted ниже. Вместо кода для всплывающего окна, живущего в отдельном html-файле, я открываю пустой URL-адрес, а затем записываю код. Кажется, что этот шаг вызывает проблему.

<html> 
<head> 
    <title>main</title> 
</head> 
<body> 
    <h1> 
     Pop & print</h1> 
    <button onclick="pop();"> 
     Pop</button> 

    <script type="text/javascript"> 
     var POP; 
     function pop() { 
      var newWin = window.open('', 'thePopup', 'width=350,height=350'); 
     newWin.document.write("<html><head><title>popup</title></head><body><h1>Pop</h1>" + 
      "<p>Print me</p><a href='print.html' onclick='window.print();return false;'>" + 
      "<img src='images/printer.png' height='32px' width='32px'></a></body></html>"); 
     } 
    </script> 

</body> 
</html>

источник

2010-03-15 sglantz

Я решил эту проблему, создав пустой HTML страницу со стандартной HTML-разметки. Затем я добавил содержимое, создав новый элемент DOM и отредактировав innerHTML. Полученный код такой же, как в примере, просто заменив newWin.document.write команду следующим:

var newDiv = newWin.document.createElement('div'); 
newDiv.innerHTML = "<h1>Pop</h1>" + 
     "<p>Print me</p><a href='print.html' onclick='window.print();return false;'>" + 
     "<img src='images/printer.png' height='32px' width='32px'></a>" 
newWin.document.body.appendChild(newDiv);

Хотя проблема была решена, я честно не знаю, что было точная причина проблема. Если у кого-нибудь есть идеи, я был бы рад их услышать.

источник

2010-03-31 14:59:35 sglantz

Возможно, это связано с тем, что вы делаете возврат false в событии onclick анкера.

Попробуйте это:

<input type="button" onclick="window.print()" value="Print" />

источник

2010-03-15 16:44:18 azamsharp

Это был тот же самый результат, работает в отдельном окне браузера, но не из всплывающего окна. – sglantz

Хм! Когда я нажимаю кнопку, она открывает стек принтера для выбора принтера. У вас есть принтеры? Может быть, он не может найти принтеры? Но в любом случае он должен открыть окно выбора принтера. – azamsharp

Пробовал ли вы код из всплывающего окна? Похоже, это то, что вызывает проблему. – sglantz

Вы можете попробовать:

<input type="button" onclick="self.print()" value="Print" />

или:

<input type="button" onclick="window.focus();window.print()" value="Print" />

Но это не может работать в MSIE из-за ограничений в Cross-Frame Scripting. Лучший способ сделать это, я думаю, состоит в том, чтобы поместить кнопку печати в главное окно.

<script language="javascript"> 
    var winref = window.open('print.html','windowName','width=400,height=400'); 
</script> 

<form> 
    <input type="button" value="Print Popup" onclick="if (window.print) winref.print()"> 
</form>

источник

2010-03-15 17:24:05 ghoppe

Ни один из первых двух методов не работал. Третий метод не идеален и усложняется, потому что код HTML-страницы генерируется из кода .Net по различным параметрам. – sglantz

Извините, что являюсь носителем плохих известий. Если бы это был я, в коде, где вы создаете кнопку/ссылку, которая открывает всплывающее окно, я бы создал два. «Показать результаты» и «Печатать результаты» или что-то еще ... – ghoppe

Похоже, мне, возможно, придется идти по этому пути, но я еще не сдаюсь. – sglantz

Если вы хотите напечатать то, что в окне вы открыли из, я предлагаю вам использовать

window.opener.print();

во всплывающем окне.

источник

2010-03-15 18:04:01 npup

Я ищу распечатать содержимое всплывающего окна, а не главное окно. – sglantz

* Doh *, очень жаль. – npup

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

Вот небольшой пример.Попробуйте в настройках и посмотрите, что произойдет! Моя проверка прошла под Windows Vista, IE7 и IE8.

main.html:

<html> 
    <head> 
    <title>main</title> 
    </head> 
    <body> 

    <h1>Pop & print</h1> 
    <button onclick="pop();">Pop</button> 
    <script type="text/javascript"> 
     var POP; 
     function pop() { 
     POP = window.open('popup.html', 'thePopup', 'width=350,height=350'); 
     } 
    </script> 

    </body> 
    </html>

popup.html:

<html> 
    <head> 
    <title>popup</title> 
    </head> 
    <body> 

    <h1>Pop</h1> 
    <p>Print me</p> 
    <a href="print.html" onclick="window.print();return false;"> 
     <img src="images/printer.png" height="32px" width="32px"> 
    </a> 

    </body> 
    </html>

источник

2010-03-17 08:46:13 npup

Этот код действительно работает с моей настройкой, но не полностью применим к моей проблеме.Основное различие заключается в том, что я генерирую html-код для всплывающего окна во время выполнения. Из-за этого я открываю пустое окно, а затем записываю html. Я обновлю вопрос с помощью тестового примера, использующего ваш код, который все еще вызывает проблему. – sglantz

Вы забыли:

newWin.document.close();

Документ должен быть закрыт, прежде чем MSIE можно распечатать.

источник

2010-07-18 11:51:30 Roose

Вот решение, которое работает для меня:

newWin.document.write(newhtml); 
newWin.window.location.reload(); // this is the secret ingredient 
newWin.focus();      // not sure if this line is necessary 
newWin.print();

Я не 100% уверен, почему это работает, но я думаю, что это имеет отношение к одному из следующих действий: (1) вопрос безопасности IE , (2) проблема с областью (т.е. после создания нового документа, IE путается о том, какой документ печатать) или (3) проблема синхронизации - документ еще не готов «принять» команду печати. В любом случае после перезагрузки диалог печати появляется без проблем.

источник

2012-03-02 14:35:04

Я хотел создать удобную для печати версию страницы, которая затем автоматически печатается, вот что я придумал, кажется, отлично работает для меня!

function printPage(){ 
    var w = window.open(); 

    var headers = $("#headers").html(); 
    var field= $("#field1").html(); 
    var field2= $("#field2").html(); 

    var html = "<!DOCTYPE HTML>"; 
    html += '<html lang="en-us">'; 
    html += '<head><style></style></head>'; 
    html += "<body>"; 

    //check to see if they are null so "undefined" doesnt print on the page. <br>s optional, just to give space 
    //This allows you to reuse this on lots of pages with the same template 
    if(headers != null) html += headers + "<br/><br/>"; 
    if(field != null) html += field + "<br/><br/>"; 
    if(field2 != null) html += field2 + "<br/><br/>"; 

    html += "</body>"; 
    w.document.write(html); 
    w.window.print(); 
    w.document.close(); 
};

источник

2013-04-19 15:38:55

Это работает в Chrome:

<body ><img src="image.jpg" alt="" style="display: block; width: 100%; height: 100%;"> 

      <script type="text/javascript"> 
       window.onload = function() { 
        window.print(); 
        setTimeout(function() { 
         window.close(); 
        }, 1); 
       }; 
      </script> 
    </body>

источник

2014-04-30 18:22:34

Как вы печатаете из всплывающего окна в javascript?

ответ

Смежные вопросы