Question

对于标题中的措辞感到抱歉，但我不确定如何准确地解释这里发生了什么。我在这里有以下代码，它基本上扩展了特定表的tbody元素，该表包含直接在表下方显示其他div的按钮。当用户按下“关闭”时，我希望它也关闭可能在表格下面打开的任何div，这些div可能是通过tbody中的链接打开的。继承我的代码：

$( "#pdays_expand" ).on( "click", function() {
               $( "#pdays_tbody" ).slideToggle( "slow", function() {
                    //$('body').scrollTo($('#pdays_tbody'),500);
                    $("#pdays_expand").text($(this).is(':visible') ? "Close" : "Expand");
               });
               if (("#pdays_tbody").is(':hidden')) {
                    $( "#search_pdays_medicare" ).hide();
                    $( "#search_pdays_medicaid" ).hide();
                    $( "#search_pdays_other" ).hide();
                    $( "#search_pdays_totalallpay" ).hide();
                    $( "#search_pdays_totalcombine" ).hide();
                    }
            });

我的问题是，当tbody打开后我按下“关闭”。它没有关闭下面列出的任何#search div，它们在表格下方保持打开状态。然而，pdays_tbody div成功关闭。

由于

Answer 1

看起来问题是，您正在检查在幻灯片动画有机会完成之前是否隐藏了paydays_tbody。从技术上讲，在动画完成之前它不会被隐藏。尝试在完整的回调中移动if块，它应该可以工作：

$( "#pdays_expand" ).on( "click", function() {
  $( "#pdays_tbody" ).slideToggle( "slow", function() {
    //$('body').scrollTo($('#pdays_tbody'),500);
    $("#pdays_expand").text($(this).is(':visible') ? "Close" : "Expand");

    if (("#pdays_tbody").is(':hidden')) {
      $( "#search_pdays_medicare" ).hide();
      $( "#search_pdays_medicaid" ).hide();
      $( "#search_pdays_other" ).hide();
      $( "#search_pdays_totalallpay" ).hide();
      $( "#search_pdays_totalcombine" ).hide();
    }
  });
});

另外，考虑为搜索div使用通用选择器（类可能是理想的）。它会为您节省一些jQuery调用，并使您的代码更具可读性和可维护性（例如，如果您想添加其他搜索字段）。

希望这有帮助！

在slideToggle上隐藏除目标div之外的div

1 个答案: