0

私のページには、さまざまなカテゴリの複数のテーブルが表示されます。各テーブルは 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();
        }
    }
});

これは機能しますが、これがこれを達成するための適切な方法であるかどうかを知りたいと思いました.

私の目標は、読み込みバーを表示することです (おそらく、そのための十分な情報を既に持っている可能性があります) が、その反復機能を使用してステータスを確認する方法が本当に好きではありません。どんなヒントでも大歓迎です

4

1 に答える 1

0

私はあなたにいくつかの変更を加えることを提案します（しかし一般的に私はあなたのコードは悪くないと思います）：

$(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();
        }
    }
});

しかし！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();
});
于 2012-12-14T08:24:26.773 に答える