Question

我有一些嵌套的复选框正在从数据库加载正确的数据，但是我想在文本标签上放一行来检查那些。它适用于二级复选框，但我无法使第一级复选框正常工作。

您可以在此处看到错误：

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");
    }
    });
});

感谢您的帮助。

Answer 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行应用于父<li>时，它也将它应用于它的子节点，即使我为未经检查的元素指定了text-decoration为none。因此，我现在不是将其应用于父<li>，而是将其应用于<span>。

Here's an updated fiddle

更新CSS onDomReady以获取嵌套复选框

1 个答案: