jquery - 在slideToggle()之后，is(':hidden')始终为false

我无法检测到jQuery slideToggle()函数的向上/向下滑动。
我已将本文用作参考Demo of slideToggle in StackOverflow

$('#ToogleMe').click(function(e) {
  e.preventDefault();
  $('#toogleResult').slideToggle();
  var check = $('#toogleResult').is(':hidden');
  if (check == true) {
    console.log('up');
  } else {
    console.log('down');
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<input type="button" id="ToogleMe" value="Toogle" />
<div id="toogleResult">Random Message</div>

#toogleResult已成功切换，但是var check始终为false。为什么是这样？

我的输出图像

最佳答案

要解决此问题，您需要在callback方法的slideToggle()参数内执行代码。这样可以确保它在动画完成且元素处于最终状态后运行。尝试这个：

$('#ToogleMe').click(function(e) {
  e.preventDefault();

  $('#toogleResult').slideToggle(function() {
    var check = $('#toogleResult').is(':hidden');
    if (check) {
      console.log('up');
    } else {
      console.log('down');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="button" id="ToogleMe" value="Toogle" />
<div id="toogleResult">Random Message</div>

关于jquery - 在slideToggle()之后，is(':hidden')始终为false，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41446922/