object1を1回クリックして関数を1回実行し(オブジェクトAをアニメーション化)、次にobject1をもう一度クリックして別の関数を実行する(別のオブジェクトBをアニメーション化する)効果を実現するための最良の方法を見つけようとしています。
誰かがここで何を使用するかについていくつかの用語を私に投げてくれませんか?jQuery / CSS add / remove / toggleクラスを介してアニメーションを実現する方法は知っていますが、最も効率的なアプローチを探しています。
JQuery の「ワンショット」イベント ハンドラーを探しています。
function first() {
$('#a').animate();
};
function next() {
$('#b').animate();
};
$('#button').one('click', function() {
first();
$('#button').click(next);
};
これによりfirst
、クリック イベントが初めて発生したときに関数が実行さnext
れ、その後のすべてのクリックでクリック イベントが関数に再バインドされます。
EDIT:代わりに、2つあり、それらを交互にしたい場合は、Vishalの提案を使用できますtoggle
:http://api.jquery.com/toggle-event/
編集2:
もう 1 つの方法は、次のように、イベント ハンドラーにカウンターを保持することです。
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;
});