HTML5の入力値バリデーションを使用して、
各入力項目のinputタグを記述するとどのようになりますか?
各項目のチェック条件
・氏名:必須チェック
・郵便番号:必須チェック、半角数字3桁、半角ハイフン、半角数字4桁の形式(例:123-4567)
・年齢:必須チェック、半角数字のみ入力、0~120までの入力のみ可能
・URL:url形式
<body>
<main id="content">
<form method="post">
<div>
<label for="name">氏名</name>
<input id="name" />
</div>
<div>
<label for="zipcode">郵便番号</name>
<input id="zipcode" />
</div>
<div>
<label for="age">年齢</name>
<input id="age" />
</div>
<div>
<label for="url">URL</name>
<input id="url" />
</div>
<div>
<input type="submit" value="送信" />
</div>
</form>
</main>
</body>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- CGI perlで書いたcgiでsqliteの使い方を教えてください 2 2023/05/08 21:29
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- その他(プログラミング・Web制作) seleniumbasic chrome操作について 1 2023/03/29 15:40
- JavaScript Javascript初心者|jQueryの.val()で値を取得し複数の要素を連結させる方法知りたい 2 2022/06/02 12:06
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HTML属性での「""」 「''」違い
-
htmlのolやulなどlistにtitleや...
-
スペースを使わず文字位置を揃...
-
セクションをdivで囲むと見出し...
-
複数のボタンを等間隔に、かつ...
-
html の divとtable の役割
-
min-heightとheightの違いについて
-
div要素が重なってします
-
iframeを使わずに上下50%ずつに...
-
h1のテキストサイズよりh2の方...
-
フッター固定で余白ができます
-
hタグの右横に画像を表示
-
<div id="container">の使いか...
-
サイドバーの高さを本文部分と...
-
ブログのサイドバーが下にくる
-
<div>テキスト</div>
-
overflow-x : hiddenが効かない;
-
レイアウトが崩れる・・・
-
XHTMLでループ処理のやり方
-
1時間30分を簡単に表したいで...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
HTML属性での「""」 「''」違い
-
htmlのolやulなどlistにtitleや...
-
div要素が重なってします
-
複数のボタンを等間隔に、かつ...
-
html の divとtable の役割
-
<div id="container">の使いか...
-
min-heightとheightの違いについて
-
ヘッダーとフッターだけ背景を...
-
1時間30分を簡単に表したいで...
-
要素間、要素内に隙間が空く
-
画面を縮小するとカラムが落ち...
-
h1のテキストサイズよりh2の方...
-
divの中に外部のHTMLを埋め込む
-
スペースを使わず文字位置を揃...
-
<!-- #BeginLibraryItemとは
-
hタグの右横に画像を表示
-
グリッドレイアウトで"auto-fit...
-
セクションをdivで囲むと見出し...
-
開閉式の隠し要素が一瞬表示さ...
-
html5でheaderの中にnav
おすすめ情報