javascript - 每次点击同一元素都会发生不同的事件

Question

如何为每次单击按钮触发一个新事件。 我如何将其放入循环中，因此在“单击 3”之后它会再次以“单击 1”开始。

$('button').click(function () {

     //click 1
     cameraTween( camera.position, 1, 1, 1 );

     //click 2
     cameraTween( camera.position, 2, 2, 2 );

     //click 3
     cameraTween( camera.position, 3, 3, 3 );

});

Answer 1

一种解决方案是使用.one创建通用函数带有递归:

function LoopEvent(selector, event, calls /*array of functions*/) {
    $(selector).one(event, function() {
        // Execute Function
        calls[0](); 

        // Send current function to the back of the array
        calls.push(calls.shift());

        // Attach next event
        LoopEvent(selector, event, calls);
    });
}

然后你可以这样调用它:

LoopEvent("button", "click", [
  function() { cameraTween( camera.position, 1, 1, 1 ); },  
  function() { cameraTween( camera.position, 2, 2, 2 ); },
  function() { cameraTween( camera.position, 3, 3, 3 ); }
]);

<强> Example Fiddle