web-dev-qa-db-ja.com

JQueryでラベルテキストを設定する

これは非常に簡単なはずですが、次のコードは次のラベルのテキストを変更する限りは何もしません。 .text、.htmlなどを使用してみましたが、役に立ちませんでした。このコードに何か問題はありますか？

<script type="text/javascript">
$(document).ready(function()
{
    $("input:checkbox").on("change", checkboxChange);

    function checkboxChange()
    {
        $("#"+this.id).next("label").text("TESTTTT");
    }
});
</script>



<td width="15%" align="center"><input type="checkbox" name="task1" id="task1"></td>
<td width="25%" align="center"><label for="task1"></label></td>
javascriptjqueryhtmlonchange
8
user470760

チェックボックスはtdにあるため、最初に親を取得する必要があります。

$("input:checkbox").on("change", function() {
    $(this).parent().next().find("label").text("TESTTTT");
});

または、同じforを持つidを持つラベルを見つけます（逆トラバーサルよりもパフォーマンスが高い可能性があります）。

$("input:checkbox").on("change", function() {
    $("label[for='" + $(this).attr('id') + "']").text("TESTTTT");
});

または、より簡潔にするためにthis.id：

$("input:checkbox").on("change", function() {
    $("label[for='" + this.id + "']").text("TESTTTT");
});
20
Abhitalks

DOMツリーを繰り返し再帰するのではなく、for属性を照会するだけです。

$("input:checkbox").on("change", function() {
    $("label[for='"+this.id+"']").text("TESTTTT");
});
8
CodingIntrigue