チェックボックスとラジオボタン

HTMLを使用した記述方法

記述方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
</head>
<body>
<form action="./dmy.cgi" method="POST">
<input type="radio" name="gakunen" value="1" checked="checked">:1年生<br>
<input type="radio" name="gakunen" value="2">:2年生<br>
<input type="radio" name="gakunen" value="3">:3年生<br>
<input type="radio" name="gakunen" value="4">:4年生<br>
<input type="radio" name="gakunen" value="5">:5年生<br>
<input type="radio" name="gakunen" value="6">:6年生<br>
<input type="checkbox" name="kamoku" value="国語" checked="checked">:国語<br>
<input type="checkbox" name="kamoku" value="算数">:算数<br>
<input type="checkbox" name="kamoku" value="理科">:理科<br>
<input type="checkbox" name="kamoku" value="社会">:社会<br>
<input type="submit" name="sub" value="送信">
</form>
</body>
</html>

表示サンプル

:1年生
:2年生
:3年生
:4年生
:5年生
:6年生
:国語
:算数
:理科
:社会

解説

<form>」と「</form>」の間に配置します。「type="radio"」と指定することによりラジオボタン、「type="checkbox"」と指定することによりチェックボックスを設置することができます。ラジオボタンは1項目だけ選択可能ですが、チェックボックスは複数項目選択可能となっています。各設定項目は次のようになっています。

  • name 属性」で部品の名前を指定します。データが送信されるときに、この名前とデータが組になって送信されます。
  • value 属性」で送信されるデータを設定します。
  • checked 属性」で初期状態を指定します。選択を初期状態とする場合は「checked="checked"」とします

フォームについての詳細は「フォームってなに?」を参照下さい。