php - JS for 和 while 循环与 jQuery ajax 在 Chrome 中锁定

Question

我有一位 friend 想要将数据从一个数据库增量移动到另一个数据库并在执行此操作时显示错误。我觉得我可以为他编写一个快速脚本来提供帮助，我在大约一个小时内完成了它，并且在 Opera 和 Firefox 中运行良好(使用蜻蜓和 Firebug 进行测试)。当他在 Chrome 中尝试时，浏览器会锁定，直到 for 或 while 循环完成，并且需要相当长的时间才能完成。这是我的代码(没有读取 json 的错误捕获部分):

jQuery.noConflict();
jQuery('#myForm').submit(function(form) {
    form.preventDefault();
    var increment = (jQuery("input#increment").val())*1;
    var total = jQuery("input#total").val();
    var progress = 0;
    jQuery("#progressbar").progressbar({value: 0});
    //for (progress = 0; progress < total; progress = progress + increment)
    while (progress < total)
    {
        jQuery.ajax({
            url: 'progressBarAjax.php',
            type: "POST",
            async: false,
            dataType: "json",
            data: {
                ajax: 'goAjax',
                total: total,
                increment: increment,
                progress: progress
            },
            success: function(data){
                jQuery("#progressbar").progressbar({value: data.value});
            }
        });
        progress = progress + increment;
    }
});

此外，为了进一步引用，用于捕获错误的代码已在调试期间被删除，并且 data.value = Floor(($progress/$total) * 100)。您还可以看到我在其中尝试过一段时间，并且在 Opera 和 Firefox 中都可以正常工作，但在 Chrome 中则不行。

知道为什么会发生这种行为对于 future 的项目来说是很高兴的，但我也想正确地编写它。目标是进行 20 万次插入/更新，并将它们分成更小的 block ，同步运行查询，并在此过程中更新进度条。

Answer 1

好吧，您使用的是async:false，因此浏览器将在发出请求时锁定。如果增量为 0，则 while 也可能进入无限循环..

我认为你实际上想要查询服务器，如果服务器回来并说它的 json 响应尚未完成，那么再次查询它，直到它说它已经完成。像这样的东西:

var increment, total, progress;

function getProgress(){
    jQuery.ajax({
        url: 'progressBarAjax.php',
        type: "POST",
        async: true,
        dataType: "json",
        data: {
            ajax: 'goAjax',
            total: total,           // Obviously, I don't know what these
            increment: increment,   // do on your server, so I've kept
            progress: progress      // them here.
        },
        success: function(data){
            // Assuming data.value is the progress from 1-100?
            // otherwise, figure out the progress from the data response
            progress = data.value;
            jQuery("#progressbar").progressbar({value: progress});
            if(progress < 100){
                getProgress();
            }else{
                // All done
                alert('done'); 
            }  
        }
    });
}

jQuery('#myForm').submit(function(form) {
    form.preventDefault();
    // Only go if we aren't currently.
    if(progress == null || progress == 100){
        increment = (jQuery("input#increment").val())*1;
        total = jQuery("input#total").val();
        progress = 0;
        getProgress();
    }
});