Written by Kasumi

【簡単】HTMLのformでリセットボタンを入れる方法

HTMLのformタグでお問い合わせフォームを作成している。

入力内容をリセットするボタンを導入したい。

本記事ではこのような悩みを解決します。

実装サンプル

See the Pen
Untitled
by Kohei (@kouk05)
on CodePen.0

実装サンプルです。

テキストボックスに内容を入れてリセットボタンを押すと入力された内容が削除されます。

導入方法は以下の通りです。

inputのtype属性でresetを入れる

<input type="reset">

リセットボタンの導入は至ってシンプル。

inputタグを入れてtype属性の値にresetを指定するだけでOK。

以上でリセットボタンの導入が完了です。

まとめ

JavaScript、jQueryなどは使わずHTMLのみで実装できます。

ぜひ参考にしてみてください。

以上で解説を終わります。

目次

関連記事

WordPress プログラミング

wordpressパーマリンクの設定で一部だけリンク設定を変更する方法

更新日:2020.07.18
2593
Webツール プログラミング

chromeブラウザで更新したファイルのキャッシュ有効期間を調べる方法【htmlサイト】

2022.01.20
8841
WordPress プログラミング

【簡単】wordpressで投稿記事ページ・固定ページをコピーする方法【プラグインで解決】

2022.02.21
2226
WordPress プログラミング

【wordpress】子カテゴリページで親カテゴリの情報を取得する方法

2021.11.01
2122