0

如何在 blogger.com 上托管的食谱网站上添加打印按钮？我有这个食谱网站，我想在网站上添加一个打印按钮，以便访问我博客的用户能够打印食谱。

4

1 回答 1

1

如果您可以打印整个页面，那么您可以使用此代码块：

<button onclick="window.print()">Print this page</button>

如果您只想打印配方，则需要使用 HTML ID 对其进行标记，实现此类解决方案的最佳方式如下：HTML：

<div id="recipe">
       <!-- Your HTML for the recipe goes here -->
</div>
<button onclick="printDIV(recipe)">Print Recipe</button>

还有一点 Javascript：（来自这篇文章：打印 DIV 的内容）

function printDIV(div) {
       var mywindow = window.open('', 'PRINT', 'height=400,width=600');

       mywindow.document.write('<html><head><title>' + document.title  + '</title>');
       mywindow.document.write('</head><body >');
       mywindow.document.write('<h1>' + document.title  + '</h1>');
       mywindow.document.write(document.getElementById(elem).innerHTML);
       mywindow.document.write('</body></html>');

       mywindow.document.close(); // necessary for IE >= 10
       mywindow.focus(); // necessary for IE >= 10*/

       mywindow.print();
       mywindow.close();
}

要更改打印的大小，您可以更改 window.open() 函数中的高度和宽度参数。

于 2021-02-21T20:15:50.663 回答