HTML フォームと入力
HTML フォームと入力
HTML フォームは、さまざまな種類のユーザー入力を収集するために使用されます。
HTML フォーム
フォームとは、フォーム要素を含む領(lǐng)域です。
フォーム要素を使用すると、ユーザーはテキスト領(lǐng)域、ドロップダウン リスト、ラジオボタン、チェックボックスなどのコンテンツをフォームに入力できます。
フォームはフォームタグ <form> を使用して設(shè)定されます:
<form>
<input type="">
<input type="">
</form>
HTML フォーム - 入力要素
ほとんどの場合に使用されるフォーム タグは、input タグ (<input>) です。
入力の型はtype屬性(type)で定義されます。一般的に使用される入力タイプのほとんどは次のとおりです。
テキスト フィールド
テキスト フィールドは、ユーザーがフォームに文字を入力する場合、<input type="text"> タグを通じて設(shè)定されます。數(shù)字やその他の內(nèi)容が含まれる場合に使用されます。
<form> 姓名: <input type="text" name="name"><br> 年齡: <input type="text" name="old"> </form>
注: フォーム自體は表示されません。また、ほとんどのブラウザでは、テキスト フィールドのデフォルトの幅は 20 文字です。
パスワード フィールドはタグ <input type="password"> で定義されます:
<form> 密碼: <input type="password" name="pwd"> </form>
注: パスワード フィールドの文字はプレーン テキストでは表示されず、アスタリスクまたはドットに置き換えられます。
ラジオボタン
<input type="radio"> 標(biāo)簽定義了表單單選框選項(xiàng) <form> <input type="radio" name="sex" value="male">男 <br> <input type="radio" name="sex" value="female">女 </form>
チェックボックス
<input type="checkbox"> 選択項(xiàng)目から 1 つまたは複數(shù)のオプションを選択する必要があります。 。
<form> <input type="checkbox" name="hobby" value="LOL">我喜歡玩LOL <br> <input type="checkbox" name="hobby" value="CF">我喜歡玩CF </form>
送信ボタン
<input type="submit"> は送信ボタンを定義します。
ユーザーが確認(rèn)ボタンをクリックすると、フォームの內(nèi)容が別の送信ボタンに送信されます。ファイル。フォームの action 屬性は、宛先ファイルのファイル名を定義します。通常、action 屬性で定義されたファイルは、受信した入力データに対して関連する処理を?qū)g行します。 :
<form name="input" action="html_form_action.php" method="get"> 用戶名: <input type="text" name="user"> 密碼: <input type="password" name="pwd"> <input type="submit" value="Submit"> </form>
上記をまとめると:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <form> 姓名：<input type="text" name="name"><br/><br/> 性別：<input type="text" name="sex"><br/><br/> 年齡：<input type="text" name="old"><br/><br/> <input type="radio" name="sex" value="male">男 <br/><br/> <input type="radio" name="sex" value="female">女 <br/><br/> 我的愛好： <br/><br/> <input type="checkbox" name="hobby" value="LOL">LOL <br/><br/> <input type="checkbox" name="hobby" value="CF">CF <br/><br/> <input type="checkbox" name="hobby" value="DOTA">DOTA <br/><br/> 我的家鄉(xiāng)： <select> <option value="beijing">北京</option> <option value="shanghai">上海</option> <option value="guangzhou">廣州</option> <option value="xianggang">香港</option> </select> <br/><br/> 用戶名: <input type="text" name="user"> <br/><br/> 密 碼: <input type="password" name="pwd"> <br/><br/> <input type="submit" value="提交"> </form> </body> </html>
