JavaScriptでWebページに印刷ボタンを追加する方法
作成日:2009.11.18
Webページに印刷ボタンを追加したい場合、JavaScriptを使って簡単に印刷機能を実装できます。本記事では、window.print()を使用した印刷ボタンの作成方法を説明し、実際にボタンを表示させるコードを紹介します。
error この記事は最終更新日から15年以上が経過しています。
ブラウザで表示しているページの印刷は、JavaScipt の、
window.print();で行なえます。
なので、サイト上に印刷ボタンを設置したければ、
<form method="get" action="#">
<input type="button" value="印刷する"
onclick="window.print();" />
</form>とでも書いておけば以下のようなボタンが表示されます。
奈良市を拠点に、26年以上の経験を持つフリーランスWebエンジニア、阿部辰也です。
これまで、ECサイトのバックエンド開発や業務効率化システム、公共施設の予約システムなど、多彩なプロジェクトを手がけ、企業様や制作会社様のパートナーとして信頼を築いてまいりました。
【制作会社・企業様向けサポート】
Webシステムの開発やサイト改善でお困りの際は、どうぞお気軽にご相談ください。小さな疑問から大規模プロジェクトまで、最適なご提案を心を込めてさせていただきます。
ぜひ、プロフィールやWeb制作会社様向け業務案内、一般企業様向け業務案内もご覧くださいね。
highlight.js 入門 ― CDN を活用したシンタックスハイライトの基本ガイド
2025.06.05
highlight.js を使ったシンタックスハイライトの導入方法を具体的なコード例とともに紹介します。CDN 経由でライブラリを読み込み、HTML コード内の <pre> と <code> タグを利用して、正確な言語指定とスタイル適用を実現する手法を分かりやすく解説。初心者でもすぐに実装できる内容となっています。
チェックボックス操作のためのjQuery基本メモ
2025.02.05
jQueryを使ってチェックボックスの状態を操作するための基本的なコードをまとめています。フォームやインタラクティブなUIを作成する際に役立つ内容です。
jQueryでフォームのreadonly属性を操作する方法
2025.02.04
jQueryを使ってフォーム要素のreadonly属性を動的に操作する方法について解説します。readonlyの設定と解除の手順をシンプルにまとめました。
ダッシュボードのパフォーマンス改善：Ajaxとiframeの実践例
2024.12.11
サーバーサイドですべてを処理してから画面を出力するのではなく、データを分割して効率的に表示する手法をご紹介。Ajaxとiframe、それぞれの特徴や実装例をわかりやすく解説します。