【问题标题】:Jquery 2 Clicks function AnimateJquery 2 Clicks 函数动画
【发布时间】:2012-08-30 20:32:38
【问题描述】:

我想在第一次点击时让 div 向右滑动,当它再次点击时,我希望它回到原来的位置

我有以下内容,但 div 没有移动,并且 console.log 显示 clicked-2 即使在第一次点击时也是如此。

$('.note-title').click(function(){
        console.log("clicked-1");
        $(this).animate({'margin-left':'200px'},200);
    },function(){
        console.log("clicked-2");
        $(this).animate({'margin-left':'0px'},200);
    }); 

【问题讨论】:

    标签: jquery jquery-animate


    【解决方案1】:

    简单地使用布尔标志怎么样?

    var clickOne = true;
    $('.note-title').click(function(){
      if (clickOne){
        $(this).animate({'margin-left':'200px'},200);
      }else{
        $(this).animate({'margin-left':'0px'},200);
      }
      clickOne = !clickOne;
    }
    

    每次单击都会切换标志的值并执行条件表达式的不同部分。

    【讨论】:

      【解决方案2】:

      注意这个方法是depreciated。您应该使用 Lix 的解决方案。


      使用.toggle

      $('.note-title').toggle(function(){
          console.log("clicked-1");
          $(this).animate({'margin-left':'200px'},200);
      },function(){
          console.log("clicked-2");
          $(this).animate({'margin-left':'0px'},200);
      }); 
      

      使用.click,每次点击都会触发所有传入的回调,一个接一个。

      【讨论】:

      • toggle 鼠标事件已弃用
      • @undefined 啊,我在更改日志中错过了。它尚未在 api 中更改。 bugs.jquery.com/ticket/11786
      • @KevinB 唯一提到弃用 toggle 的地方是面包屑 类别:弃用 |事件 > 鼠标事件deprecated 页面,不幸的是,这有点令人困惑。
      • 博客文章中也有。 1.8.0 版本未更新 api 中的很多案例。
      猜你喜欢
      • 1970-01-01
      • 2013-06-14
      • 2014-09-29
      • 2011-07-18
      • 2018-01-31
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多