Javascript 为什么'；当我点击隐藏的容器时，它不会重新出现吗？

我有一个隐藏的容器，其中包含注释，还有一个

，里面有一个

，上面写着“显示所有注释”，我单击它来显示注释。当我单击div时，它会完美地显示隐藏的注释容器，但当我再次单击它时，它不会隐藏注释容器。我想我的jQuery代码可能有问题

var commentsHidden = $( ".comments-container" ).is( ":hidden" );

if (commentsHidden) {
  $( ".see-all" ).click(function() {
      $('.comments-container').show('slow');
      $('.see_hide').text('Hide Comments');
    });

} else {

    $( ".see-all" ).click(function() {
      $('.comments-container').hide();
    });

};

当您调用（'click'，..）上的

或其快捷方式
单击（..）
时，您将安装一个新的处理程序。最终的结果是，在同一个对象上有多个处理程序，它们都会被调用。相反，请仅安装一次处理程序：

// In global code or code that gets executed upon module load
// Only once!
$(".see-all").click(function() {
  if ($( ".comments-container" ).is( ":hidden" )) {
    $('.comments-container').show('slow');
    $('.see_hide').text('Hide Comments');
  } else {
    $('.comments-container').hide();
  }
});

或旧处理程序：

$( ".see-all" ).off('click'); // Unbind all click handlers

var commentsHidden = $( ".comments-container" ).is( ":hidden" );
if (commentsHidden) {
  $( ".see-all" ).click(function() {
    $('.comments-container').show('slow');
    $('.see_hide').text('Hide Comments');
  });
} else {
  $( ".see-all" ).click(function() {
    $('.comments-container').hide();
  });
};

您需要检查click函数（）中的标志状态。现在的方式只会在页面加载时绑定一次单击处理程序

$( ".see-all" ).click(function() {
    var commentsHidden = $( ".comments-container" ).is( ":hidden" );
    if (commentsHidden) {
        $('.comments-container').show('slow');
        $('.see_hide').text('Hide Comments');
    } else {
         $('.comments-container').hide();
    }
});

初始化commentsHidden时，它从未更新，因此它始终具有初始值。你需要检查它是否在每次点击时隐藏。因此，不需要if语句来附加事件。只需附加一个单击事件，检查事件内部是否隐藏，并相应地继续

$(".see-all").click(function() {
    var commentsHidden = $(".comments-container").is(":hidden");
    if (commentsHidden) {
        $('.comments-container').show('slow');
        $('.see_hide').text('Hide Comments');
    } else {
        $('.comments-container').hide();
    }
});

试着换成

$( ".see-all" ).click(function() {
  var commentsHidden = $( ".comments-container" ).is( ":hidden" );
  if (commentsHidden) {
      $('.comments-container').show('slow');
      $('.see_hide').text('Hide Comments');
    });
  } else {
    $( ".see-all" ).click(function() {
      $('.comments-container').hide();
    });
  }
});

单击处理程序只能绑定一次，每次单击p元素时，您都需要检查注释是否隐藏。
您可以在问题中包含html吗？条件应该包含在
单击处理程序中，而不是相反。ifs不会神奇地运行和绑定新事件。没问题！祝你好运