Javascript (jQuery) все еще работает после того, как вся его работа завершена

Question

Я использую jQuery для загрузки массивной таблицы в пакетах строк. Я загружаю начальные строки, затем я делаю вызовы $ .ajax, чтобы добавить строки в тело таблицы. По завершении вставки следующего фрагмента строк я вызываю метод для обработки следующего фрагмента строк. Смотрите код ниже. Проблема в том, что даже после того, как весь контент загружен, javascript по-прежнему утверждает, что выполняется - когда я перехожу на другую страницу, он жалуется, что есть подпрограмма javascript, замедляющая страницу, и я хочу прервать ее. На данный момент он не должен быть запущен! Эта подпрограмма первоначально вызывается из подпрограммы $ (function () {...}) (по готовности). Любые идеи, как я должен остановить это после того, как он завершит всю свою работу?

        function processNextChunk(c, t, s, p, x) {
        var args = "{company_ID:" + c + ",shareholdingType:" + t + ",startIndex:" + s + ",pageSize:" + p + ",stack:'" + x + "'}";
        //alert(args);
        $.ajax({
            type: "POST",
            url: "TestStructure6.aspx/GetNextHierarchyPage",
            data: args,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                //Append the content to the bottom of the table tag.
                //Returning 2 arguments from the result, hence the split (initial
                //value is an int, so not a big deal using pipe as a delimiter)
                if (msg.d.length > 0) {
                    var slash = msg.d.indexOf('|');
                    var r;
                    if (slash > 0) {
                        x = msg.d.substr(0, slash);
                        r = msg.d.substr(slash + 1, msg.d.length - slash);
                        $('#h  > tbody').append(r);
                        if (r.length > 0) {
                            var percent = (s + p) / totalRows * 100;
                            $('#counter').html(parseInt(percent) + '%');
                            setTimeout('processNextChunk(' + c + ', ' + t + ', ' + (s + p) + ', ' + p + ', "' + x + '")', 0);
                            //processNextChunk(c, t, s + p, p, x)
                        }
                        else {
                            $('#counter').html('');
                        }
                    }
                }
                return true;
            }
        });
        return true;
    }

Answer 1

Это может или не может решить вашу проблему, но вы не должны вызывать setTimeout со строковым аргументом.

Вместо этого вы должны дать ему функцию, подобную этой:

setTimeout(function() {
    processNextChunk(c, t, s + p, p);
}, 0);

Кроме того, вместо записи $('#counter').html('') вы можете написать $('#counter').empty().

Чтобы решить вашу проблему, уверены ли вы, что ваш setTimeout вызов в рекурсии навсегда?

Answer 2

Вы вызываете setTimeout (..., 0) или нулевое время ожидания. Другими словами, вы не разрешаете браузеру обновлять / перерисовывать.

Обратите внимание, что это зависит от браузера - некоторые тесты на разных машинах на протяжении многих лет показывают, что winxp требует как минимум тайм-аут 50, в то время как Linux требует тайм-аут 10. Кажется, это связано с минимальным временным интервалом в расписании ОС .

Если у вас быстрое соединение (например, разработка localhost), возможно, вызов ajax отвечает достаточно быстро, поэтому его установка на ноль является проблемой ...

Ваш код выглядит так, как будто он может просто увеличить время ожидания до чего-то большего, скажем, за 1 секунду, без вредных последствий.

[Вызов setTimeout со строковым аргументом совершенно допустим, но, похоже, вы не цитируете правильно. ]

Answer 3

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

r = msg.d.substr(slash + 1, msg.d.length - slash);

Если это так, вы можете использовать clearTimeout () в своем предложении else сразу после:

$('#counter').html('');