javascript - 防止 jQuery 函数在当前函数完成之前执行

Question

我在 jQuery 中有一个函数，每当我按下任何箭头键时都会触发该函数。以下是“向上”箭头情况的代码，其他三种情况看起来非常相似，都包含在 checkKey 函数中。

document.onkeydown = checkKey;

    function checkKey(e) {
        var divs = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten", "eleven", "twelve", "thirteen", "fourteen", "fifteen"];
        e = e || window.event;

        if (e.keyCode == '38') {
            for (i = 0; i < divs.length; i++){
                var tmp = document.getElementById(divs[i]);
                var coord = $(tmp).position();
                if ((Math.abs(embargo_top - coord.top) < 115) && (Math.abs(embargo_left - coord.left) < 15)){
                    if(embargo_top < coord.top){
                        embargo_top = coord.top;
                        embargo_left = coord.left;
                        $(tmp).animate({
                            'top': (parseInt($(tmp).css('top'), 10) - 100) + "px"
                        }, 500);
                        break;
                    }
                }
            }
            checkIfWinner();
        }

我该如何处理这些事件，以便在我按下一堆箭头键时，每次函数的执行都只会在前一个函数调用完全完成之后发生？

Answer 1

有很多方法可以做到这一点。一种方法是将它们添加到队列中，该队列一次只能做一件事。在每个函数中，完成后将其出队，以便下一个函数可以运行。你可以使用 jquery 的队列函数:http://api.jquery.com/jquery.queue/