jquery - Jquery-同一个对象，多次点击，多种功能

Question

我试图找出最好的方法来实现单击 object1 一次并导致一个函数（动画对象 A），然后再次单击 object1 并导致另一个函数（动画另一个对象-B）等效果的最佳方法。

有人可以向我扔一些术语来说明在这里使用什么吗？我确实知道如何通过 jQuery/CSS add/remove/toggle 类实现动画，但我正在寻找最有效的方法。

Answer 1

您正在寻找 JQuery 的“一次性”事件处理程序。

http://api.jquery.com/one/

function first() {
    $('#a').animate();
};

function next() {
    $('#b').animate();
};

$('#button').one('click', function() {
    first();
    $('#button').click(next);
};

这将first在第一次触发 click 事件时运行该函数，然后将 click 事件重新绑定到该next函数以进行所有后续单击。

编辑：或者，如果您有两个并希望它们交替，您可以使用 Vishal 的建议toggle：http ://api.jquery.com/toggle-event/

编辑 2：

另一种选择是在事件处理程序中保留一个计数器，如下所示：

function fireA() { /*...*/ }
function fireB() { /*...*/ }
function fireC() { /*...*/ }

$('#button').click(function() {
   var events = [fireA, fireB, fireC];

   //declare counter
   if(!this.counter) { this.counter = 0; }

   events[this.counter]();
   this.counter = (this.counter + 1) % 3;
});