Jquery animate() 不工作答案

【问题标题】：Query animate() doesnt workingJquery animate() 不工作
【发布时间】：2014-04-10 11:11:13
【问题描述】：

我有以下代码：

var isOn = false;

$('.switch').on("click",function(){

  if (isOn){


    $('.toggle').animate({
      left:"18px"
    },10,"linear",

     {
      complete: function(){
        $('#label').text("ON");
      }
    });
    isOn = false;



  } else {
    $('.toggle').animate({
      left:"4px"
    }, 10,"linear",
                         {
      complete: function(){
        $('#label').text("OFF");
      }
    });
    isOn = true;
  }

});

http://codepen.io/pietrofxq/pen/LpzDE?editors=001

这是一个用jquery制作的开关。它在没有 animate() 方法的情况下工作。
我正在使用 css 制作动画，但在 Internet Explorer 中出现问题。
下面是原效果：http://codepen.io/anon/pen/iwatp

为什么第一个链接中的完整功能不起作用？

编辑：此代码可以运行，但在 IE 上仍然无法正常运行

【问题讨论】：

哪个IE版本不工作？
第一个链接。文本不在“开”和“关”之间切换。第二个链接是我制作的版本，但在 IE 中不起作用，所以我尝试使用 animate() 函数达到相同的效果

标签： javascript jquery css

【解决方案1】：

您似乎在混合the two different signatures 的.animate 函数。如果直接将持续时间和缓动作为参数传递，则必须对回调函数执行相同操作：

$('.toggle').animate({left: "18px"}, 10, "linear", function(){
  $('#label').text("ON");
});

或者你必须传递两个对象：

$('.toggle').animate(
  {
     left:"18px"
  },
  {
    duration: 10,
    easing: "linear",
    complete: function(){
      $('#label').text("ON");
    }
  }
);

【讨论】：

我很惊讶为什么不能像 jQuery 那样工作。无论如何+1
@Pietro：对于 IMO 的这个功能，他们其实很清楚。要么是.animate( properties [, duration ] [, easing ] [, complete ] ) 要么是.animate( properties, options )。
大声笑，我的错。我仍然不习惯 jquery docs...如果他们只是使用更多示例
@Pietro：你必须阅读everything ;)

【解决方案2】：

现在它可以工作了。请检查 jsfiddle 链接 http://jsfiddle.net/banded_krait/da2kE/

我从您的代码中删除了一些括号和 complete: 数组键，希望这对您有用。

【讨论】：