Webページのフォームを送信する前に、ユーザーへの確認ダイヤログを表示するのは良いUXの一部です。特に重要な操作、例えばデータの削除や変更の際に確認を求めることで、誤操作を防ぐ助けになります。今回は、この実装方法を紹介します。 基本的なスタイルの設定 まず、確認ボタン(.btn1)のデザインを調整します。以下はそのCSSのサンプルです。自分のサイトのデザインに合わせて調整してください。 <style> * { padding: 0; margin: 0; } body { font-size: 18px; text-align: center; } h1{ text-align: center; font-size: 24px; padding: 20px 0 40px 0; line-height: 1.8em; } .btn1{ padding: 6px; } </style> HTM
![jQueryでのフォーム送信前の確認ダイヤログ実装方法|DAD UNION – エンジニア同盟](https://cdn-ak-scissors.b.st-hatena.com/image/square/f1f49532d85924338ef0663ce4a13e0e92a092e6/height=288;version=1;width=512/https%3A%2F%2Fdad-union.com%2Fwp-content%2Fuploads%2F2023%2F04%2Fpic20230410.jpg)