Question

我正在创建一个jQuery插件，它为元素添加了一些自定义动画，我想检测何时在该元素上调用.stop（）方法。这是一个例子：

(function( $ ){
    $.fn.myAnimation = function() {
        var myInterval = setInterval(function() {
            // Do animation stuff
            if (.stop() == true) {
                clearInterval(myInterval);
            {
        });
    });
});

$(".element").myAnimation();
$(".element").stop();

所以我的问题是，我该怎么做：

if (.stop() == true)

或者有一种方法可以使用这样的事件处理程序：

this.bind("stop", function() {});

或者我完全以错误的方式解决这个问题？

非常感谢斯蒂芬

Answer 1

我假设您要检查该元素是否已设置动画。如果是，您可以使用jQuery's :animated selector。

if( this.is(':animated') ) {...

如果您希望取消间隔，您可能只需要将其构建到API中作为用户调用的自定义方法，该方法将停止动画，和调用{{1} }。

Answer 2

两种可能的解决方案：

A）创建一个标志（2种方法） B）创建自定义事件

A-创建一个标志
1 - 您可以使用.attr()添加标记

$('.element').stop().attr('stopped','')
//to check use :
if($('.element').is('[stopped]'))

2 - 如果您不想要涉及任何属性或任何更改DOM结构
你可以附上一个默契的旗帜使用.data()存储任意数据：

$(".element").stop().data('stopped',true);

然后检索它以进行检查

if($(".element").data('stopped')) /** (1) **/

关于插件（如你所提到的here）
是的，我们可以创建一个：

// Stop() with a capital S, don't have to remind you jQuery is case sensitive
$.fn.Stop = function() {
  this.stop().data('stopped', true)
  return this
} // check the same way as i mentioned in (1)

B创建自定义事件
如果你不想要任何类型或任何类型的旗帜你可以创建一个自定义事件，因为＆＃39;停止＆＃39;不是一个人 Documentation about creating custom events

$('*').on('stop', function() {
  $(this).stop()
  //any other Statements you want
  //in this case you may need to change the selector
  //to match only '.element'
})

然后使用.trigger()：

触发事件

$('.element').trigger('stop')

Answer 3

在我找到添加jQuery ：animated 选择器的方法之前，我已经提出了以下解决方法：

(function( $ ){
    $.fn.myAnimation = function() {
        this.addClass("isanimated");
        var myInterval = setInterval(function() {
            // do animation
            if (this.hasClass("isanimated") == false) {
                clearInterval(myInterval);
            }
        }, 1000);
    });
});

$(".element").myAnimation();
$(".element").removeClass("isanimated");

以上代码未经过测试。

如果有人可以建议添加：动画选择器的方法，我将不胜感激。

检测jQuery .stop（）

3 个答案: