通常のdiv要素のIDとしてラベルの "for"値を使用するとhtml5定義の下で有効なhtmlです(たとえば、div内に囲まれたカスタムのドロップダウンリストの実装を行いました)属性のラベルタグを通常のdivに関連付けることはできますか?
可能な場合は仕様によるものではない、
トーマス
通常のdiv要素のIDとしてラベルの "for"値を使用するとhtml5定義の下で有効なhtmlです(たとえば、div内に囲まれたカスタムのドロップダウンリストの実装を行いました)属性のラベルタグを通常のdivに関連付けることはできますか?
可能な場合は仕様によるものではない、
トーマス
を知っている:それらのすべてのフォームに関連し、 標識可能な要素として分類されていない
いくつかの要素を、。これらは、 ラベル要素に関連付けることができる要素です。
"ボタン" "入力"(type属性が非表示状態でない場合)、 "keygenの" "メータ" "出力" "進行" "" テキストエリアを "選択"
http://www.w3.org/TR/html5/forms.html#category-label
も参照 :
ザ属性には、キャプションが関連付けられる とフォームコントロールを示すために指定されてもよいです。属性が指定されている場合、 属性の値は、ラベル要素と同じ文書 内のラベル付け可能な要素のIDでなければなりません。属性が指定されており、 のIDが for属性の値と等しい要素がドキュメント内にあり、その最初の要素がラベル付け可能な要素である場合、その要素はラベル要素のラベル付きコントロールです。
http://www.w3.org/TR/html5/the-label-element.html#attr-label-for
私は質問が有効なユースケースを提示思います。 ARIAの属性は、マークアップをよりアクセシブルにするために役立つかもしれませんが、私は、お勧めのパターンはこのようなシナリオ何のためにあるのかわからない:
https://developer.mozilla.org/en/Accessibility/ARIA/forms/Basic_form_hints https://developer.mozilla.org/Special:Tags?tag=ARIA
ティムは、ネイティブにそれを行うことはできません述べたように、しかし少しのjavascriptでそれをシミュレートすることができます
jQuery(document).delegate('[for]','click',function(e){
var targetEl = jQuery('#'+jQuery(this).attr('for'));
if(targetEl.is('div.your-custom-dropdown-class')) { //if targetEl is one of your dropdowns
e.preventDefault();
targetEl.trigger('click'); //open the drop down
}
});
展開するには、HTML5仕様から:[label要素のfor属性はフォームコントロールを参照する必要があります](http://www.w3.org /TR/html-markup/label.html#label) – steveax
おかげでティム、それは興味深い発見だ – Thomas
@steveax更新されたリンクがありますか? –