JavaScript 窗口打印页面按钮

  2. 贴士文章
  3. JavaScript 贴士
  4. JavaScript 窗口打印页面按钮
Muhammad Muzammil Hussain 2023年1月30日 2022年5月11日
JavaScript
  1. HTML 中的 window.print() 函数和用法示例
  2. 用几个步骤检查给定的 HTML 代码
  3. 如何打印浏览器页面
  4. 获得相同结果的替代方法
JavaScript 窗口打印页面按钮

JavaScript window.print() 是一种打印网页内容的简单方法。它会打开一个打印对话框，让你可以选择多个打印选项。此方法不需要任何参数，也不返回任何内容。

HTML 中的 window.print() 函数和用法示例

给定的 JavaScript 语句显示一个打印我按钮，然后它在我们试图打印它的工作表中显示该网站页面的属性。用于打开打印选项对话框的 JavaScript 函数 window.print() 用于执行打印功能。

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML | Window Print() method example
    </title>
 
    <script type="text/javascript">
    </script>
 
</head>
 
<body>
 
    <h2>Hi Users Click "Print me" to open print dialog</h2>
    <form>
        <input type="button" value="Print me"
               onclick="window.print()" />
    </form>
 
</body>
<html>

在这个 HTML 页面源代码中，我们创建了一个表单输入类型的按钮，用于在单击时调用任何函数。

你可以看到由单击事件按钮触发的 window.print() 方法。会弹出打印对话框，打印网页的内容和图片。

用户可以在打印盒上设置目的地、页面、布局、颜色和更多设置。

用几个步骤检查给定的 HTML 代码

按照这四个简单的步骤，可以清楚地了解 window.onload 方法。

  • 使用记事本或任何其他文本编辑工具创建文本文档。
  • 将给定的代码粘贴到创建的文本文件中。
  • 使用 .html 扩展名保存该文本文件，并使用任何默认浏览器打开它。
  • 你可以看到 Print me 按钮。它将调用 window.print() 函数，该函数将弹出打印对话框。

如何打印浏览器页面

如果你的默认浏览器不支持上述功能，请按照以下快速步骤访问打印选项。

  • 单击浏览器的选项 » 打印 » 单击确定。
  • 你还可以按快捷键 Ctrl+P 按钮访问打印选项。

获得相同结果的替代方法

你还可以使用另一个功能访问打印对话框选项：

document.execCommand('print');

只需使用 document.execCommand('print'); 而不是使用 window.print() 函数。它的工作原理与 window.print() 方法相同。