JavaScript ウィンドウのページ出力ボタン

Muhammad Muzammil Hussain 2023年1月30日
  1. window.print()HTML での関数と使用例
  2. 与えられた HTML コードを数ステップで調べます
  3. ブラウザページを出力する方法
  4. 同じ結果を得る別の方法
JavaScript ウィンドウのページ出力ボタン

JavaScript window.print() は、Web ページのコンテンツを出力するためのシンプルで簡単な方法です。複数の出力オプションを選択できる出力ダイアログボックスが開きます。このメソッドはパラメータを必要とせず、何も返しません。

window.print()HTML での関数と使用例

指定された JavaScript ステートメントは、Print me のボタンを表示し、次に、その Web サイトページのプロパティを、出力しようとしているシートに表示します。ここでは、出力オプションダイアログを開くための 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() メソッドを確認できます。出力ダイアログボックスがポップアップ表示され、Web ページのコンテンツと画像が出力されます。

ユーザーは、出力ボックスで宛先、ページ、レイアウト、色などの設定を行うことができます。

与えられた HTML コードを数ステップで調べます

これらの 4つの簡単な手順に従って、window.onload メソッドを明確に理解してください。

  • メモ帳またはその他のテキスト編集ツールを使用してテキストドキュメントを作成します。
  • 指定されたコードを作成されたテキストファイルに貼り付けます。
  • 拡張子 .html でそのテキストファイルを保存し、デフォルトのブラウザで開きます。

ブラウザページを出力する方法

デフォルトのブラウザが上記の機能をサポートしていない場合は、次の簡単な手順に従って出力オプションにアクセスしてください。

  • ブラウザのオプションをクリック»出力» [OK]をクリックします。
  • 短いキーCtrl+Pボタンを押して、出力オプションにアクセスすることもできます。

同じ結果を得る別の方法

別の機能を使用して、出力ダイアログオプションにアクセスすることもできます。

document.execCommand('print');

document.execCommand('print'); を使用するだけです window.print() 関数を使用する代わりに。window.print() メソッドと同じように機能します。