0

我正在尝试在 ajax 调用中调用 javascript 函数。progress每次运行 for 循环时都应该调用该函数（下面的函数）。实际发生的情况是，progress它运行的次数与运行 for 循环的次数一样多，但progress仅在其余代码完成后才运行。

我将仅发布代码的重要部分。所有变量都定义了它们应该如何。retData是正确访问的对象列表。我要解决的唯一问题是progress在 for 循环执行期间而不是之后运行。

function getAllProcess(){
    $.get(processUrl, function(retData){        
        if (navigator.appVersion.indexOf("Win")!=-1){
            windowsFillProcessTable(retData);
        }else{
            linuxFillProcessTable(retData);
        }//end else
        $('#divForProcessTable table tbody').append(processHtml);       
    });//end get
}

function windowsFillProcessTable(retData){
    $('#divForProcessTable table tbody #processTableHeaders').append("<th>Session Name</th><th>Session #</th>");
    lengthOfList = retData.list.length;
    step = 100/lengthOfList;

    if (retData.list.length > 0){
        for (var i = 0; i < retData.list.length; i++){      
            numberOfLoaded++;
            progress(step * numberOfLoaded, $('#progressBar')); 

            processHtml += '<tr><td><input type="checkbox" value="' + retData.list[i].pid + '">' + retData.list[i].pid + '</td><td>' + retData.list[i].name + '</td><td>' + retData.list[i].virtualMemorySize + '</td><td>' + 
            retData.list[i].user + '</td><td>' + retData.list[i].cpuTime + '</td><td>' + retData.list[i].status + '</td><td>' + retData.list[i].sessionName + '</td>' +
            '<td>' + retData.list[i].sessionNumber + '</td></tr>';                          
        }//end for
    }//end if for length
    else{
        processHtml = '<tr><td colspan="15">There are no processes matching that expression</td></tr>';
    }
}

//Loading bar action
function progress(percent, $element) {
    var d = new Date();
    console.log(new Date());
    var progressBarWidth = percent * $element.width() / 100;
    $element.find('div').animate({ width: progressBarWidth }, 500).html(percent + "%&nbsp;");
}
4

2 回答 2

3

我认为您实际面临的问题不是progress在循环完成时运行一次for，而是div您试图反映该更改的位置仅在windowsFillProcessTable完成执行时更新。由于 JavaScript 是单线程的（目前windowsFillProcessTable），因此每隔一个处理（包括 DOM 更新）执行块。

你必须找到一个替代方案来更新你的进度条。有关可能的选项，请参阅此或此。

于 2013-06-10T17:05:42.483 回答
0

事实证明，通过使用工人可能是可能的，但我不知道如何正确使用它们。到目前为止，我将把它标记为我的答案，因为没有其他人就如何使用工作线程异步更新 DOM 给出任何指导。此外，对于工作人员，您无法直接访问 DOM。您无法通过工作人员访问的列表： DOM（它不是线程安全的） 窗口对象 文档对象 父对象

我从：http ://www.html5rocks.com/en/tutorials/workers/basics/得到这个

于 2013-07-17T15:10:07.393 回答