0

我有一个名为： 

this.makeStuffHappen()

它根据 switch 语句和几个变量制作不同的动画。是否有可能使函数不触发，除非之前所有的都完成了解决。

我想写类似的东西

$('button').click(function(){
    a.makeStuffHappen();
    b.makeStuffHappen();
    c.makeStuffHappen();
    d.makeStuffHappen();
});

然后它应该只在 a 完成后运行 b ，在 b 完成后运行 c ，在 c 完成后运行 d 。是否只能通过链接它们使动画等待前一个？是否可以链接任何功能？

编辑： makeStuffHappen() 正在为不同的元素设置动画，因此 a.makeStuffHappen() 将为与 b.makeStuffHappen 等不同的元素设置动画。

谢谢。

4

4 回答 4

2

最简单（或至少最灵活）的方法是使用延迟对象[docs]。为此，您必须从每个函数返回一个延迟对象，例如：

a.makeStuffHappen = function() {
    elementA.animate(...);
    elementB.animate(...);
    ...


    return $.when(elementA, elementB,...);
};

b.makeStuffHappen等相同。

$.when() [docs]返回一个延迟对象，您可以在其中附加回调，一旦传递给它的所有延迟对象都被解析，就会执行该回调。

然后在您的事件处理程序中，您可以在这些延迟对象上调用.pipe() [docs]，将它们链接在一起：

$('button').click(function(){
    a.makeStuffHappen()
       .pipe($.proxy(b.makeStuffHappen, b))
       .pipe($.proxy(c.makeStuffHappen, c))
       .then(function() {
           console.log('All done');
       });
});

演示

于 2012-04-24T19:51:01.063 回答
1

看看jquery的队列功能： http ://api.jquery.com/queue

于 2012-04-24T19:27:48.137 回答
1

回调将是最简单的方法，但由于您不想使用回调（jQuery.queue()确实需要 - 嗯......无论如何都是递归回调），您可以让您拥有的方法返回一个布尔值：

$('button').click(function()
{
    var theObjects = [a,b,c,d];
    for (var i=0;i<theObjects.length;i++)
    {
        if (theObjects[i].makeStuffHappen() === false)
        {
            break;//or throw, or whatever...
        }
    }
});

当然，方法很可能会根据调用的对象而有所不同。您可以通过使用对象而不是数组来解决此问题，在这种情况下，您的事件处理程序可能类似于：

$('button').click(function()
{
    var theObjects = {a:'aMethod',b:'bMethod',c:'cMethod'};
    for(var i in theObjects)
    {
        if (theObjects.hasOwnProperty(i))
        {
            if(window[i][theObjects[i]]() === false)
            {
                break;//or throw, or return...
            }
        }
    }
});

请注意，我不知道你为什么不想在这里使用某种形式的回调，因为这将是最简单的方法......但这当然不是我关心的...... :- )

好吧，快速浏览一下你的游戏……看起来很有趣，继续努力吧:)。顺便说一句，您离在所有地方使用回调仅一步之遥：

$('#placeBet').click(function() {
    placeBet();
});

可以写成：

$('#placeBet').click(placeBet);

在后者中，placeBet 是一个回调函数。我认为您主要关心的是：

player.printHand();
dealer.printHand(isDealerHidden);

我在这里要做的是更改 printHand 函数，方法是在末尾添加：

if (this.name !== 'dealer')
{
    dealer.printHand(isDealerHidden);
}

我没有阅读足够多的脚本来使这项工作按您的需要进行，但是您明白了……更简单的方法是不明确地为经销商设置动画，而是更改玩家手上的所有动画师以结束一些在玩家动画完成后动画经销商的代码......我知道，我在胡说八道，但我在工作......而且生病了......无论如何，祝你好运。我可能会花更多时间检查您的进度，也许今晚更仔细地阅读您的脚本并将此运球编辑为实际可行的内容:-)

于 2012-04-24T19:44:45.747 回答
1

您可以在方法中添加回调函数：

this.makeStuffHappen = function(callback)  {
   //do things like animations
   $(this).animate({ ... }, 200, callback);
   //or call the callback after everything is done:
   callback();
}

你可以像这样使用它：

$('button').click(function(){
    a.makeStuffHappen(b.makeStuffHappen(c.makeStuffHappen(d.makeStuffHappen())));
});
于 2012-04-25T12:01:10.457 回答