Сообщение AJAX не надежно, использование '.then' также не работает

Question

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

Я использовал серию методов поста AJAX для публикации информации об идентификаторе div на странице PHP, которая затем запускает цикл и получает все категории в базе данных.

Это выполняется в четыре этапа: сначала вызывается категория верхнего уровня 1, а затем категория верхнего уровня 2, затем запускаются два цикла 3-9 и 10-50, эти циклы должны извлечь до 50 категорий из базы данных и отсортировать их.

Метод post не всегда работает, иногда, когда страница загружается нормально, иногда пропускает некоторые из <li>Я ожидаю, что это связано с тем, что некоторым AJAX требуется один для загрузки, прежде чем он сможет работать, поэтому я попытался использовать.then и обратные вызовы для упорядочения постов, это не работает.

$(document).ready(function() {

    var IDs = [];
    $("#menu").find("li").each(function() {
        IDs.push(this.id);
    });
    var arr = $.makeArray(IDs);
    var full_list = ""
    for (var i = 0; i < arr.length; ++i) {
        full_list = full_list + arr[i] + ' '

    }
    //INDEPENDANT CALL
    function A() {
            $.ajax({
                url: 'DisplayCategories/SubCat.php',
                type: 'post',
                data: {
                    'Parent': full_list
                },
                success: function(data) {
                    var Element = data.slice(0, 2);
                    NewData = data.substr(2);
                    $(Element).after(NewData);


                }
            }).error(function() {
                alert('error');
            }).complete(function(data) {
                var Element = data.slice(0, 2);
                NewData = data.substr(2);
                $(Element).after(NewData);


            });
        }
        //INDEPENDANT CALL

    function B() {
        $.ajax({
            url: 'DisplayCategories/SubCatCrafts.php',
            type: 'post',
            data: {
                'Parent': full_list
            },
            success: function(data) {
                var Element = data.slice(0, 2);
                NewData = data.substr(2);
                $(Element).after(NewData);


            }
        }).error(function() {
            alert('errosr');
        }).complete(function(data) {
            var Element = data.slice(0, 2);
            NewData = data.substr(2);
            $(Element).after(NewData);


        });
    }

    function C() {
        for (i = 3; i < 10; i++) {
            $.ajax({
                url: 'DisplayCategories/SubCatLevelThree.php',
                type: 'post',
                data: {
                    'Parent': i
                },
                success: function(data) {
                    var Element = data.slice(0, 2);
                    NewData = data.substr(2);
                    $(Element).after(NewData);


                }
            }).error(function() {
                alert('error');
            }).complete(function(data) {
                var Element = data.slice(0, 2);
                NewData = data.substr(2);
                $(Element).after(NewData);


            });


        }
    }

    function D() {
        for (s = 11; s < 50; s++) {
            $.ajax({
                url: 'DisplayCategories/SubCatLevelEleven.php',
                type: 'post',
                data: {
                    'Parent': s
                },
                success: function(data) {
                    var Element = data.slice(0, 3);
                    NewData = data.substr(3);
                    $(Element).after(NewData);


                }
            }).error(function() {
                alert('error');
            }).complete(function(data) {
                var Element = data.slice(0, 3);
                NewData = data.substr(3);
                $(Element).after(NewData);



            });

        }
    }
    B();
    A();
    C();
    D();

});

Вы можете увидеть это в прямом эфире здесь

Answer 1

Ваш PHP-бэкэнд не всегда возвращает контент, но он всегда возвращает 200 HTTP-код. Это означает, что ваш успешный обратный вызов также вызывается каждый раз. Ваш успешный обратный вызов предполагает, что всегда есть возвращаемый контент, которого нет, и, таким образом, выдает ошибку, когда он предполагает, что "данные" являются массивом, и что "срез" может быть вызван, останавливая ваше выполнение в его треках. Короче говоря, вам действительно нужно исправить свой бэкэнд, и вы также должны выполнить проверку в своем javascript данных, возвращаемых вашим php, чтобы убедиться, что объект, "данные" в этом случае, является тем, чем вы думаете.

Вы также можете использовать консоль разработки, чтобы вы могли увидеть все это самостоятельно. Я довольно люблю Firebug в Firefox, но во всех основных браузерах есть встроенный.