M.C.P.C.

―むり・くり―プラスコミュニケーション(更新終了)


| トップページ |

2006年12月18日 00:34

はてブしね!どこの世界にlabel要素内にa要素付けるバカがいるんだ!

このエントリーをはてなブックマークに追加 mixiチェック

別にしなんでもいいけれども、input 要素の type 属性が checkbox とか radio とかのとき、そのアイテムだけじゃ選択しにくいから、label 要素を使って、アイテムの説明書きのテキストをクリックしても選択できるようにしますよね。

処置前

<input type="checkbox" id="sod" />ソフトオンデマンド

ソフトオンデマンド

処置後

<input type="checkbox" id="moodyz" /><label for="moodyz">ムーディーズ</label>

「ソフトオンデマンド」のほうは、チェックボックスをクリックしないと選択できないけれども、「ムーディーズ」のほうは、ムーディーズという文字列をクリックしても選択できるよ。

ちなみに、僕はかつて、linklabel 要素を知らずに、一生懸命 JavaScript で同じものを実装しようとしていました……

つわけで、linklabel 要素をクリックすると、関連づけしたアイテムの状態が変化する、つうのがベース。

~~~

さて、はてなブックマークでは。



▲はてぶのラジオボタンの脇のラベルをクリックすると、ラジオボタン選択にならずに、別のページに飛ぶよ。

なんで、linklabel 要素の中に a 要素入れるかなープンスカ。

これってブラウザ側が悪いことになるの? マークアップはあくまでマークアップって言われるとそれまでなんだけれども。


(2006.12.19 9.38訂正)

<del>link</del><ins>label</ins>

はてなブックマークのコメント欄で指摘がありました。ありがとうございました。


(2006.12.19 9.42追加)

<strong>▲はてぶのラジオボタンの脇のラベルをクリックすると、ラジオボタン選択にならずに、別のページに飛ぶよ。</strong> を追加

FLASH ムービー見れないと意味がわからないので追加しました。

投稿 大野 義貴 [Web] | |

トラックバック(0)

トラックバックURL: http://blog.dtpwiki.jp/MTOS/mt-tb.cgi/1914

コメントする