2

大きなマッピング/ウィジェットのJavaScriptファイル（1.3 MB）を調達していて、ロード時に進行状況バーを表示したいと思いました。私はfirebugのネットウォッチタブがこの情報の多くを知っていることを知っていますが、もっと軽量なものが欲しいです。私はこのウェブサイトに出くわしました：http： //blog.greweb.fr/2012/04/work-in-progress/

ダウンロードしているファイルを入手する必要があることを除けば、ほとんどそこにたどり着きます。ファイルのダウンロード時に、jQueryのgetScriptにリスナーが表示されませんでした。ソースファイルのダウンロードの進行状況を確認する方法を知っている人はいますか？

前もって感謝します！

4

1 に答える 1

8

を使用するgetScript()場合は、成功コールバックを使用して関数を実行できますが、それはスクリプトの読み込みが完了したときのみです。

読み込みインジケーターの画像（ http://ajaxload.info/で多く見つけることができます）を用意し、スクリプトが読み込まれたときに非表示にすることをお勧めします。

このSOには他にもいくつかのアイデアがあります。1つの解決策は以下のとおりです。

var myTrigger;
var progressElem = $('#progressCounter');
$.ajax ({
    type            : 'GET',
    dataType        : 'xml',
    url             : 'somexmlscript.php' ,
    beforeSend      : function (thisXHR)
    {
        myTrigger = setInterval (function ()
        {
            if (thisXHR.readyState > 2)
            {
                var totalBytes  = thisXHR.getResponseHeader('Content-length');
                var dlBytes     = thisXHR.responseText.length;
                (totalBytes > 0)? progressElem.html (Math.round ((dlBytes/ totalBytes) * 100) + "%") : progressElem.html (Math.round (dlBytes /1024) + "K");
            }
        }, 200);
    },
    complete        : function ()
    {
        clearInterval (myTrigger);
    },
    success         : function (response)
    {
        // Process XML
    }
});

これにより、ロードされたバイトと合計バイトを取得して進行状況を計算する間隔が設定されます。これはあなたのために働くかもしれません。

于 2012-06-29T17:03:24.233 に答える