Jquery动画图像，位置，宽度和高度

Question

我有一个动画制作的情况＆＃34; img＆＃34;当我把我的var完全放在点击功能里面时它不会有动画但是当我把它放在功能之外时它会工作。它有全球性的东西吗？和当地范围？谢谢

var complete = true;


$("img").click(function() {

    if (complete) {

        $(this).animate({
            left: "50%",
            top: "400px",
            width: "300px",
            height: "300px"

        }, 700);

    } else {

        $(this).animate({
            left: "8px",
            top: "10px",
            width: "150px",
            height: "150px"
        }, 700);
    }

    complete = !complete;
});

Answer 1

如果你把

var complete = true;

在click处理程序的回调中，每次调用该函数时都会将其定义为true，这实质上将函数重新定义为

$("img").click(function() {

  if (true) {

    $(this).animate({

      left: "50%",
      top: "400px",
      width: "300px",
      height: "300px"

    }, 700);

  } else {

    $(this).animate({

      left: "8px",
      top: "10px",
      width: "150px",
      height: "150px"

    }, 700);

  }

});

进一步简化：

$("img").click(function() {

  $(this).animate({

    left: "50%",
    top: "400px",
    width: "300px",
    height: "300px"

  }, 700);

});

通过在函数外部定义complete，变量的值将持续超出函数的单个调用，允许每次调用切换全局状态。