Выполнить набор работ в цикле только после завершения предыдущего набора

Question

У меня есть некоторый код, который выполняет отдельный набор операций в цепочке. Сам набор операций выполняется в цикле. Из-за природы системы, с которой я имею дело, наборы операций должны выполняться синхронно (то есть следующий набор операций не может быть выполнен до завершения первого набора). Асинхронное выполнение может сбить удаленный процессор (не в моем контроле) и привести к сбою кода. Прямо сейчас, единственный способ, которым я смог заставить это работать, состоит в том, чтобы использовать окна предупреждения, которые действительно хромают и не вариант. Я пробовал:

• с использованием $ .ajax и установкой асинхронности на false
• с использованием функции сна
• окна оповещения (используется в отчаянии)

Вот код - Есть мысли?

$('input:checked').each(function(index){                        

    //get the item's location id
    var currentInput = $(this).val();

    var copyUser = function(){$.get(urlCopyPrefix + currentInput + urlSuffix);}
    var moveUser = function(){$.get(urlMovePrefix + moveLocation + urlSuffix);}

    var cleanup = function(){

        var newSibling = $('#module-' + moveLocation);
        newSibling.before('<li>New Line</li>');

        alert('done');
    }

    /* --> THIS IS THE CODE IN QUESTION <-- */
    $.when(copyUser()).pipe(moveUser).then(cleanup);

});

Answer 1

Вы должны вернуть объект jqXHR из ваших функций:

var copyUser = function(){
        return $.get(urlCopyPrefix + currentInput + urlSuffix);
    },
    moveUser = function(){
        return $.get(urlMovePrefix + moveLocation + urlSuffix);
    };

Тогда вы можете сделать:

$.when( copyUser() ).pipe( moveUser ).then( cleanup );

---

Если вы хотите дождаться выполнения каждого элемента в цикле, прежде чем начнется следующий, используйте это:

var $items = $('input:checked'),
    length = $items.length,
    copyUser = function(currentInput)
    {
        return $.get(urlCopyPrefix + currentInput + urlSuffix);
    },
    moveUser = function()
    {
        return $.get(urlMovePrefix + moveLocation + urlSuffix);
    },
    cleanup = function()
    {
        $('#module-' + moveLocation).before('<li>New Line</li>');
    };

function processUser(i)
{
    $.when( copyUser($items.eq(i).val()) ).pipe( moveUser ).then(function()
    {
        cleanup();
        i < length && processUser(++i);
    });
}

processUser(0);

Answer 2

Я думаю, вам придется прекратить использовать .each(), потому что он сразу запускает всю итерацию, и вы не хотите этого делать.

Вот один из способов сделать это, используя функции завершения илокальная функция:

function copyMove(moveLocation, urlCopyPrefix, urlMovePrefix, urlSuffix)
    var checked = $('input:checked');
    var index = 0;

    function next() {
        if (index < checked.length) {
            var currentInput = checked.eq(index++).val();
            $.get(urlCopyPrefix + currentInput + urlSuffix, function() {
                $.get(urlMovePrefix + moveLocation + urlSuffix, function() {
                    $('#module-' + moveLocation).before('<li>New Line</li>');
                    next();
                });
            });
         }
    }

    next();
}

Или, используя deferreds:

function copyMove(moveLocation, urlCopyPrefix, urlMovePrefix, urlSuffix)
    var checked = $('input:checked');
    var index = 0;

    function copyUser () { 
        var currentInput = checked.eq(index).val();
        return $.get(urlCopyPrefix + currentInput + urlSuffix);
    }
    function moveUser() {
        return $.get(urlMovePrefix + moveLocation + urlSuffix);
    }
    function cleanup() {
        ++index;
        $('#module-' + moveLocation).before('<li>New Line</li>');
        next();
    }

    function next() {
        if (index < checked.length) {
            $.when(copyUser()).pipe(moveUser).then(cleanup);
         }
    }

    next();
}

Примечание о ваших отложениях: Вы должны передавать ссылки на функции, а не вызовы функций.Это означает, что вы передаете имя функции без скобок.