JavaScript ウィンドウのページ出力ボタン
Muhammad Muzammil Hussain
2023年1月30日
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
でそのテキストファイルを保存し、デフォルトのブラウザで開きます。 -
Print me
ボタンが表示されます。window.print()
関数を呼び出し、出力ダイアログボックスをポップアップします。
ブラウザページを出力する方法
デフォルトのブラウザが上記の機能をサポートしていない場合は、次の簡単な手順に従って出力オプションにアクセスしてください。
- ブラウザのオプションをクリック»出力» [OK]をクリックします。
- 短いキーCtrl+Pボタンを押して、出力オプションにアクセスすることもできます。
同じ結果を得る別の方法
別の機能を使用して、出力ダイアログオプションにアクセスすることもできます。
document.execCommand('print');
document.execCommand('print');
を使用するだけです window.print()
関数を使用する代わりに。window.print()
メソッドと同じように機能します。