1

データベースから正しいデータを読み込んでいるネストされたチェックボックスがいくつかありますが、チェックされているもののテキストラベルに線を入れたいと思います。第 2 レベルのチェックボックスでは正常に動作していますが、第 1 レベルのチェックボックスを正常に動作させることができませんでした。

ここでバグを見ることができます：

http://jsfiddle.net/Zfv7h/3/

$(document).ready(function() {
  $(".content-finalized").each(function() {
    if ($(this).attr("checked")) {
     $(this).closest("li").css("text-decoration", "line-through");
    }
    });
  $(".subchapter-finalized").each(function() {
    if ($(this).attr("checked")) {
      $(this).closest("li").css("text-decoration", "line-through");
    }
    });
});

ご協力いただきありがとうございます。

4

1 に答える 1

1

更新された回答

Javascriptをこれに変更します

$(document).ready(function () {
    $("input.content-finalized:checkbox:checked").next('span').css("text-decoration", "line-through");
    $("input.subchapter-finalized:checkbox:checked").parent().css("text-decoration", "line-through");
});

HTMLマークアップを少し変更する必要がありました。私がしたことは、チャプターを でラップすることだけでした。理由は次のとおりです。CSS の line-through を parent<li>に適用すると、未チェックの要素に対して text-decoration を none に指定したにもかかわらず、その子にも適用されました。だから、それを親に適用する代わりに、代わりにに<li>適用してい<span>ます。

ここに更新されたフィドルがあります

于 2013-03-24T01:38:43.460 に答える