Question

我的页面显示了不同类别的多个表，每个表都是通过ajax加载的。

类别的数量可能会有所不同，但我知道在进行ajax调用之前会有多少类别。我同时向他们展示了所有这些：

$(function(){
    var categories = 3; // this is calculated dynamically
    var categoriesLoaded = 0;

    $('#categoryA').load('/getCategoryA', function(){categoriesLoaded++;checkLoadProgress();});
    $('#categoryB').load('/getCategoryB', function(){categoriesLoaded++;checkLoadProgress();});
    $('#categoryC').load('/getCategoryC', function(){categoriesLoaded++;checkLoadProgress();});

    function checkLoadProgress(){
        if(categoriesLoaded == categories){
            $('.spinner').hide();
            $('.categories').show();
        }
    }
});

除非我想知道这是否是实现这一目标的一种不错的方式，但除此之外我想知道。

我的目标是有一个加载栏（也许我已经有足够的信息），但我真的不喜欢我检查状态的方式，具有重复功能。欢迎任何提示

Answer 1

我建议你做一些改动（但一般来说我觉得你的代码还不错）：

$(function(){
    var categories = 3; // this is calculated dynamically

    for(var categoriesLoaded = 0; categoriesLoaded < categories; categoriesLoaded++){
        var charCode = String.charCodeAt('A') + categoriesLoaded;
        var symbol= String.fromCharCode(charCode);
        $('#category'+ symbol).load('/getCategory' + symbol, function(){categoriesLoaded + 1;checkLoadProgress();});
    }

    function checkLoadProgress(){
        if(categoriesLoaded == categories){
            $('.spinner').hide();
            $('.categories').show();
        }
    }
});

BUT！只有在加载了所有类别且没有返回任何内容时才使用checkLoadProgress（），这就是为什么它似乎只能写出来：

$(function(){
    var categories = 3; // this is calculated dynamically

    for(var categoriesLoaded = 0; categoriesLoaded < categories; categoriesLoaded++){
        var charCode = String.charCodeAt('A') + categoriesLoaded;
        var symbol = String.fromCharCode(charCode);
        $('#category'+ symbol).load('/getCategory' + symbol);
        //function() was deleted
    }

    $('.spinner').hide();
    $('.categories').show();
});

jQuery如何通过ajax加载多个页面部分

1 个答案: