Question

我正在学习jQuery，我只是在测试事件和条件是如何工作的。我也使用Velocity.js进行动画制作。这是代码：

$(function() {

$( "#navBar" ).click(function() {
    var isOpen = false;
      if (isOpen == false){
       $( this ).velocity({ height: 300});
          isOpen = true;
          console.log(isOpen);
          return false;
      }
      else{
       $( this ).velocity({ height: 50});
          isOpen = false;
          console.log(isOpen);
      }

   });

});

我不知道为什么这不起作用。 if条件执行并登录到控制台变量为true。但是在第二次单击后继续运行if条件并返回isOpen为true。我无法执行else语句。

Answer 1

因为您在isOpen = false;内声明它，所以每次都click。所以请将其保持在click event之外，如下所示：

$(function() {
   var isOpen = false; //this here
   $( "#navBar" ).click(function() {
      if (isOpen == false){
          $( this ).velocity({ height: 300});
          isOpen = true;
          console.log(isOpen);
          return false;
      }
      else{
          $( this ).velocity({ height: 50});
          isOpen = false;
          console.log(isOpen);
      }
   });
});

Answer 2

在外部点击处理程序中声明isOpen，因为在处理程序中将其设置为false始终。

var isOpen = false;

$( "#navBar" ).click(function() {

      if (isOpen == false){
       $( this ).velocity({ height: 300});
          isOpen = true;
          console.log(isOpen);
          return false;
      }
      else{
       $( this ).velocity({ height: 50});
          isOpen = false;
          console.log(isOpen);
      }

   });

});

变量始终计算为false

2 个答案: