點擊功能jQuery插件只允許單擊

我已經創建了這個簡單的插件添加多個動畫點擊，但問題是，一旦對象被點擊它不能重複點擊動畫，我不能找出爲什麼添加的類不會在點擊功能完成後自行移除，以便再次點擊並重復..任何建議？點擊功能jQuery插件只允許單擊

(function($) { 
    $.fn.vivify = function(options) { 
     var defaults = { 
      animation: 'bounce', 
     }; 
     var options = $.extend(defaults, options); 
     return this.each(function() { 
      var o = options; 
      var obj = $(this); 
      var animation = o.animation; 
      obj.bind("click", function() { 
       obj.addClass(o.animation); 
       obj.addClass('vivify'); 
      }, function() { 
       obj.removeClass(o.animation); 
      }); 
     }) 
    } 
})(jQuery);

來源

2012-06-02 JamesBong

想要刪除類，動畫結束後？ – thecodeparadox

obj.bind("click", function() { 
     obj.addClass(o.animation); 
     obj.addClass('vivify'); 
}, 
// this callback is not valid 
function() { 
    obj.removeClass(o.animation); 
});

因爲.bind()接受參數，如下列：

.bind(eventName, [eventData], [callback])

閱讀.bind()

要刪除類，你可以這樣做：

obj.bind("click", function() { 
    obj.addClass(o.animation); 
    obj.addClass('vivify'); 
    // you can removeClass here 
    obj.removeClass(o.animation); 

    // but you need some delay 

    setTimeou(function() { 
     obj.removeClass(o.animation); 
    }, 5000); 
});

要我現象越來越多，你可以做超時如下：

return this.each(function(index, val) { 
     var o = options; 
     var obj = $(this); 
     var animation = o.animation; 
     obj.bind("click", function() { 
     obj.addClass(o.animation); 
     obj.addClass('vivify'); 
     }, index * 2000); 
});

來源

2012-06-02 16:39:10 thecodeparadox

謝謝！我嘗試了建議的方法，但它不起作用，仍然只有一次點擊觸發 – JamesBong

@ user1427307你可以讓小提琴在這裏http://jsfiddle.net – thecodeparadox

http://jsfiddle.net/Fmr9g/1/在這裏你去 – JamesBong

這裏的工作示例（我猜的，因爲我不知道到底什麼是你的插件的預期效果）：你當

http://jsfiddle.net/gabrieleromanato/Fmr9g/

來源

2012-06-02 16:59:31

你的工作完美，但我然後編輯它應用我的動畫，沒有運氣..這裏的更新小提琴，http：//jsfiddle.net/ Fmr9g/1 /有什麼建議？ – JamesBong

現在問題與CSS相關，而不是jQuery。事實上，如果您檢查DOM，您會看到CSS類按預期更改。 –

下面是使用CSS3動畫的另一個工作示例：http://jsfiddle.net/gabrieleromanato/Fmr9g/3/ –

點擊功能jQuery插件只允許單擊

回答

相關問題