WebTecNote

[XHTML]応募フォームっぽい入力項目のメールフォーム

2008-05-14 (水)
Form
HTML&XHTML | Template

求人情報の応募フォームにありそうな入力項目のXHTMLフォームのコピペ用サンプル。

classやIDは一切使ってないのでスニペットとしても使えると思います。
テーブル使用。注釈はsmall。
結構手抜いてます。

PLAIN TEXT

HTML:

<form action="" method="post">
<table cellpadding="0" cellspacing="0" border="1">
<tr><th scope="row">お名前</th>
<td><input name="name" type="text" size="50" /><small>（全角）</small></td></tr>
<tr><th scope="row">ふりがな</th>
<td><input name="name2" type="text" size="50" /><small>（全角）</small></td></tr>
<tr><th scope="row">生年月日</th>
<td><input name="birth" type="text" size="20" /><small>（例：1980/04/01）</small></td></tr>
<tr><th scope="row">性別</th>
<td><input name="sex" type="radio" value="男性" />男性
<input name="sex" type="radio" value="女性" />女性</td></tr>
<tr><th scope="row">E-Mail</th>
<td><input name="email" type="text" size="50" /></td></tr>
<tr><th scope="row">電話番号</th>
<td><input name="tel" type="text" size="50" /><small>（例：1234-56-7890）</small></td></tr>
<tr><th scope="row">携帯電話・PHS番号</th>
<td><input name="tel2" type="text" size="50" /><small>（例：090-1234-5678）</small></td></tr>
<tr><th scope="row">郵便番号</th>
<td><input name="postcode" type="text" size="10" /><small>(例：507-0000)</small></td></tr>
<tr><th scope="row">住所</th>
<td><input name="address" type="text" size="50" /></td></tr>
<tr><th scope="row">現在役職の有無</th>
<td><input name="businesspost" type="radio" value="あり" />あり
<input name="businesspost" type="radio" value="なし" />なし</td></tr>
<tr><th scope="row">最終学歴</th>
<td><input name="schoolcareer" type="text" size="50" /></td></tr>
<tr><th scope="row">資格</th>
<td><textarea name="license" cols="70" rows="3"></textarea></td></tr>
<tr><th scope="row">職務経歴</th>
<td><textarea name="history" cols="70" rows="10"></textarea></td></tr>
<tr><th scope="row">自己PR</th>
<td><textarea name="message" cols="70" rows="10"></textarea></td></tr>
<tr><th scope="row">入社希望時期</th>
<td><input name="enter" type="text" size="50" /></td></tr>
<tr><th scope="row">その他希望条件</th>
<td><textarea name="other" cols="70" rows="5"></textarea></td></tr>
</table>
<p><button type="submit">送信</button><button type="reset">リセット</button></p></form>

サンプルのCSSは続きにあります。

Comments: 0
Trackbacks: 0

[js]メールアドレスを自動収集されないように表示する

2008-05-13 (火)
Javascript
AntiSpam | Javascript

放置してたメールボックスを受信してみたら1000通もスパムが溜まってた。さすがに驚いた。

スパマーはWebサイトに記載されてるメアドをgoogleのクローラのようなbotで拾っていくとか。
直接メアド書くのは最早時代遅れとなりつつあり、お手軽な方法としてはエンティティ化が流行ってる様子。
でも唐突にエンコード文字があると逆に怪しいと思うんだけどどうでしょう。
個人的にはあのクソ長い文字の羅列はあまり好きじゃない。ソフトが勝手にデコードしたりするし。

そこでmailtoリンクつきのメールアドレスをスタイリッシュにjavascriptで表示するサンプルを。
前にmootoolsで書いたけど、今回は普通のjavascriptで。