[携帯]フォームで使うパーツをまとめてみた │ これからゆっくり考L +α

[携帯]フォームで使うパーツをまとめてみた

携帯サイトに限ったことではないですが、フォームページの作成って結構骨が折れるというか心が折れるというか眠くなるというか。
そんなフォームページを簡単にやっつけるべく、コピペでペタペタはっていけるようにまとめてみました。

フォームサンプル画面
こんなフォームページがちょちょいのちょいと。

Dreamweaverなどを使っている場合はスニペットに登録しておくとかなり作業効率がアップしますよ？
ただ、Dreamweaverを使わずに秀丸とかでコーディングする時もあるので、そういう時の自分の為に。

メニュー

さくっとコピペできるように、html用とxhtml用で分けています。

・html用のフォームパーツ
・xhtml用のフォームパーツ

数字とか値は適当に入っているので、コピペしたら直してくださいませ。

html用のフォームパーツ

・基本のパーツ
・割とそのまま使えるパーツ
- ・名前
- ・住所
- ・生年月日
- ・性別
- ・同意規約
- ・ボタン

基本パーツ

formタグ

<form action="" method="">

</form>

一行テキスト

<input type="text" value="" size="">

プルダウン

<select name="xx">
<option selected> </option>
<option value="x">サンプル</option>
<option value="x">サンプル</option>
</select>

ラジオボタン

hoge<input type="radio" value="" name=""> hoge<input type="radio" value="" name="">

チェックボックス

hoge<input type="checkbox" value="" name=""> hoge<input type="checkbox" value="" name="">

テキストボックス

<textarea name="" cols="27" rows="5">
だみーです。
</textarea>

ボタン

<input type="submit" value="ボタン">

割とそのまま使えるパーツ

名前

お名前<br>
<input type="text" value="" size="27">

姓<br>
<input type="text" value="" size="27">

名<br>
<input type="text" value="" size="27">

姓(カナ)<br>
<input type="text" value="" size="27">

名(カナ)<br>
<input type="text" value="" size="27">

住所

〒<input type="text" value="" size="6">-<input type="text" value="" size="4"><br>
住所<br>
<input type="text" value="" size="27">

都道府県<br>
<select name="都道府県">
	<option selected> </option>
	<option value="北海道">北海道</option>
	<option value="青森県">青森県</option>
	<option value="秋田県">秋田県</option>
	<option value="岩手県">岩手県</option>
	<option value="山形県">山形県</option>
	<option value="宮城県">宮城県</option>
	<option value="福島県">福島県</option>
	<option value="山梨県">山梨県</option>
	<option value="長野県">長野県</option>
	<option value="新潟県">新潟県</option>
	<option value="富山県">富山県</option>
	<option value="石川県">石川県</option>
	<option value="福井県">福井県</option>
	<option value="茨城県">茨城県</option>
	<option value="栃木県">栃木県</option>
	<option value="群馬県">群馬県</option>
	<option value="埼玉県">埼玉県</option>
	<option value="千葉県">千葉県</option>
	<option value="東京都">東京都</option>
	<option value="神奈川県">神奈川県</option>
	<option value="愛知県">愛知県</option>
	<option value="静岡県">静岡県</option>
	<option value="岐阜県">岐阜県</option>
	<option value="三重県">三重県</option>
	<option value="大阪府">大阪府</option>
	<option value="兵庫県">兵庫県</option>
	<option value="京都府">京都府</option>
	<option value="滋賀県">滋賀県</option>
	<option value="奈良県">奈良県</option>
	<option value="和歌山県">和歌山県</option>
	<option value="岡山県">岡山県</option>
	<option value="広島県">広島県</option>
	<option value="鳥取県">鳥取県</option>
	<option value="島根県">島根県</option>
	<option value="山口県">山口県</option>
	<option value="徳島県">徳島県</option>
	<option value="香川県">香川県</option>
	<option value="愛媛県">愛媛県</option>
	<option value="高知県">高知県</option>
	<option value="福岡県">福岡県</option>
	<option value="佐賀県">佐賀県</option>
	<option value="長崎県">長崎県</option>
	<option value="熊本県">熊本県</option>
	<option value="大分県">大分県</option>
	<option value="宮崎県">宮崎県</option>
	<option value="鹿児島県">鹿児島県</option>
	<option value="沖縄県">沖縄県</option>
</select>

生年月日

生年月日<br>
<input type="text" value="" size="5"> 年 <input type="text" value="" size="3"> 月 <input type="text" value="" size="3"> 日

生年月日<br>
<select name="year">
<option selected> </option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
</select>年

<select name="month">
<option selected> </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>月

<select name="day">
<option selected> </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
</select>日

性別

性別<br>
女<input type="radio" value="" name=""> 男<input type="radio" value="" name="">

同意規約

同意規約<br>
<input type="checkbox" name="" value=""> 同意する

ボタン

<input type="submit" value="確認する">

<input type="submit" value="確認画面へ">

<input type="submit" value="送信">

<input type="reset" value="リセットする">

xhtml用のフォームパーツ

・基本のパーツ
・割とそのまま使えるパーツ
- ・名前
- ・住所
- ・生年月日
- ・性別
- ・同意規約
- ・ボタン