html - HTMLラベルの「For」値

Question

入力タイプのチェックボックスタグにリンクしようとしているラベルタグがあります。複数のラベルと複数のチェックボックス入力があり、それらはすべて同じIDと同じ名前ですが、値が異なります。IDではなく値にリンクするラベルを作成する方法を誰かに教えてもらえますか？したがって、この：

<label for="8994"></label>

リンク先：

<input id="member_ids_" name="member_ids[]" type="checkbox" value="8994">

それともこれは不可能ですか？

score 4 · Accepted Answer

ラベルの属性は、それが参照する要素forのIDと一致する必要があります。<input>あなたの場合、それは次のようになります：

<label for="member_id_8994"></label>
<input id="member_id_8994" name="member_ids[]" type="checkbox" value="8994">

score 2 · Accepted Answer

フォーム要素の「for」は、同じフォーム要素のIDと一致する必要があります。

<label for="id_1"></label>
<input id="id_1" name="member_ids[1]" type="checkbox" value="8994">

<label for="id_2"></label>
<input id="id_2" name="member_ids[2]" type="checkbox" value="8994">

<label for="id_3"></label>
<input id="id_3" name="member_ids[3]" type="checkbox" value="8994">

<label for="id_3"></label>
<input id="id_3" name="member_ids[4]" type="checkbox" value="8994">

score 1 · Accepted Answer

DOM要素には異なるIDが必要です。各IDがその値に設定されている場合でも......または何でも。

同じIDを持つことはできません。

それが邪魔にならないようになったらfor、ラベルの設定は本当に簡単になります。

score 0 · Accepted Answer

おそらく機能しないjQueryソリューション。

 $(function() {
    ModifyLabels({target: $('input')});
    $('input').change(ModifyLabels);
 });

function ModifyLabels(eventObject) {
    var inputs = $(eventObject.target);
    input.each(function(i, input) {
         $('label').each(function(i, label) {
             if ($(label).attr('for') == $(input).val()) {
                $(input).attr('id', $(input).val());
             }
         });
    });
}

score 0 · Accepted Answer

それが可能かどうかは疑問です。のラベルは、入力のid属性に関連付けられています。目的を達成するための1つの方法は、JavaScript、たとえばノックアウトの宣言型バインディングなどです。

こちらで確認してください：http：//knockoutjs.com/documentation/introduction.html

この線に沿った何か：

<label data-bind="click: myInput"></label>
<input type="checkbox" id="hello">

<script type="text/javascript">
    var myInput= {
        //implement the function to bind the label to the input#hello here
        }
    };
</script>

http://knockoutjs.com/documentation/click-binding.html

html - HTMLラベルの「For」値

5 に答える 5

Related

Reference