隠し項目

画面上には表示せず利用者からの入力なども必要ないが特定の値を一緒に送信したい場合があります。このような隠し項目を使うにはinput要素を使いtype属性に「hidden」を指定して下さい。

HTML4.01

<input type="hidden" name="名前" value="値">

XHTML

<input type="hidden" name="名前" value="値" />

※以降はXHTMLの場合で記載します。

name属性には部品に対する名前を指定します。そしてvalue属性には値を設定します。hidden要素は表示されませんので利用者が値を変更することはありません。その為、value要素に設定した値がそのまま「名前=値」の形で送信されます。

具体的には次のように記述します。

<form action="#" method="post">
<p>
<input type="radio" name="seibetu" value="man" />男性
<input type="radio" name="seibetu" value="woman" />女性<br />
<input type="hidden" name="questionno" value="100" /><br />
<input type="submit" name="button" />
</p>
</form>

実際にWebページに配置すると次のように表示されます。

隠し項目は画面上には表示されませんが、データ送信時には一緒に値が送られます。では試しにどちらかのラジオボタンをチェックしてからボタンをクリックして送信して送られるデータを確認してみます。

index.html?seibetu=man&questionno=100

このように「questionno=100」という隠し項目に設定した「名前=値」も送信されていることが確認できます。

WebWord