$(function() {
    $("table.section thead").click(function() {
      if ($(this).next("table.section tbody").style.display == "block"){
         $(this).next("table.section tbody").slideUp("slow");
      }
      if ($(this).next("table.section tbody").style.display == "none"){
         $(this).next("table.section tbody").slideDown("slow");
      }
    });
});

我不知道如何做到这一点,任何帮助将是非常赞赏。

更新:

我试图使用下列函数。

$(function() {
    $("table.section thead").click(function() {
    $(this).next("table.section tbody").slideToggle("slow");

    });
});

它给了我一个问题,(当THEAD它崩溃,你点击它,它扩大,然后再次崩溃,所以这将永远是崩溃)。这就是为什么我试图让顶部的功能。

有帮助吗?

解决方案

在这种情况下使用可见选择器:

$(function() {
    $("table.section thead").click(function() {
      var body = $(this).next("table.section tbody");
      if (body.is(":visible"))
         body.slideUp("slow");
      else
         body.slideDown("slow");
    });
});

但可能要简单得多只是使用 .slideToggle() 这样的:

$(function() {
    $("table.section thead").click(function() {
      $(this).next("table.section tbody").slideToggle("slow");
    });
});
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top