Как вставить кнопку "Печать", которая печатает форму на веб-странице?

Итак, допустим, я получил простую форму внутри страницы, как это:

<form style="text-align:center;">
    <p> STUFF </p>
</form>

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

Изменить: я хочу распечатать форму, а не страницу.

4 ответа

Решение

Распечатать всю страницу

Попробуйте добавить кнопку, которая вызывает window.print()

<input type="button" value="Print this page" onClick="window.print()">

Распечатать определенную часть / контейнер на странице

<div id="print-content">
 <form>

  <input type="button" onclick="printDiv('print-content')" value="print a div!"/>
</form>
</div>

затем в HTML-файл добавить этот код скрипта

<script type="text/javascript">
    function printDiv(divName) {
        var printContents = document.getElementById(divName).innerHTML;
        w=window.open();
        w.document.write(printContents);
        w.print();
        w.close();
    }

Только для печати

Чтобы распечатать с помощью кнопки отправки, добавьте это в ваш скрипт саммита:

<input type="button" value="Print this page" onClick="window.print()">

Имейте в виду, что это вызовет только те функции печати, которые реализованы в браузере и доступны на клиенте.

Что вам нужно, так это window.print():

<form style="text-align:center;">

  <p> STUFF </p>

  <a href="#" id="lnkPrint">Print</a>
</form>

Javascript:

$( document ).ready(function() {
    $('#lnkPrint').click(function()
     {
         window.print();
     });
});

Помимо вышеизложенного, есть еще несколько подходов, которые вы можете использовать здесь:

      <a href="Javascript:window.print();">Print</a>

и не включать JS в ваш HTML:

Другие вопросы по тегам