【JavaScript】ウェブサイトに「印刷する」ボタンを設置する方法。

Ads by Google

ブラウザでのウェブサイト観覧時も含め、通常、印刷する際は[⌘ + P](Command + P)でプリントアウトすることができますが、これと同じ挙動を JavaScript で実装することができます。

記述するコードは非常に簡単で、基本的に必要なのは以下の1行のみ。

window.print();

windowオブジェクトのprintメソッドを呼ぶだけ。これで印刷ダイアログを表示させることができます。
具体的に「このページを印刷」ボタンを作るには、HTMLを以下のように書けばOKです。

ボタンで設定する場合

<form>
<input type="button" value="このページを印刷する" onclick="window.print();" />
</form>

リンクで設定する場合

<a href="javascript:void(0)" onclick="window.print();return false;">このページを印刷</a>

上記の HTMLとJavaScript を実装させたサンプルを用意しましたので、合わせてご覧ください。

サンプルデモ:JavaScript で「印刷する」ボタンを実装

「このページを印刷する」のボタンまたはリンクをクリックすると、ブラウザの印刷ダイアログが表示されるはずです。
ただし、閲覧環境にプリンタがセットアップされていない場合は、ブラウザによってはエラーを表示して印刷ダイアログが表示されないので注意が必要です。

こちらの記事もいかがですか?

アナタにオススメ!
同じカテゴリーの他の記事です。

Ads by Google

Leave a Replyコメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です