Question

我意识到这就是它应该表现的方式，但是当我试图确定一个元素在隐藏过程中的可见性时它会产生一个问题（或者在'：animated'时显示我是否反转）真）。

那么我如何使用jQuery来确定一个元素是否可见，但需要注意的是元素当前可见但是在隐藏自身的过程中被认为是隐藏的（不是当前行为），并且在显示自身的过程中的元素仍然是被认为是可见的（当前行为）？

由于在jQuery事件中检查：可见，因此问题变得更加严重，因此没有直接的代码路径，从元素显示/隐藏到可见性检查需要发生的位置。因此，我不能只通过其间的所有功能传递动画状态。

以下是一些用于说明问题的代码：

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript">
      var spn, result1, result2, lastDelayedResult, lastResetResults;

      $(document).ready(function() {
        spn = $('#spn');
        result1 = $('#result1');
        result2 = $('#result2');
      });

      function toggle() {
        clearTimeout(lastDelayedResult);
        clearTimeout(lastResetResults);
        result2.text("");

        spn.slideToggle();
        result1.text("The text is " + visibility() + ".  ");

        lastDelayedResult = setTimeout(function(){delayedResult();}, 1000);
        lastResetResults = setTimeout(function(){resetResults();}, 3000);
      }
      function visibility() {
        return (spn.is(':visible')) ? "visible" : "hidden";
      }
      function delayedResult() {
        result2.text("After a second the text is " + visibility() + ".");
      }
      function resetResults() {
        result1.text("");
        result2.text("");
      }
    </script>
  </head>
  <body>
    <span id="result1"></span>&nbsp;
    <span id="result2"></span>
    <hr/>
    <input id="btn" name="btn" type="button" onclick="toggle();" value="Click Me!"/><br/>
    <span id="spn">I am the text!</span>
  </body>
</html>

Answer 1

是否可以使用动画回调方法来保证元素的最终状态，而不是查询并可能获得错误的状态。由于您的示例是为了简单地演示问题，因此很难知道这是否适用于您的应用程序，但我几乎总是发现将依赖于动画的代码在回调中完成比使用动画更容易过程

jQuery：执行隐藏动画时，visible为true

1 个答案: