0

私のアプリケーションは、標準的な方法でページをロードするのではなく、AJAX/JSONPを介してHTMLとJavaScriptをロードします。これはIframeで動作するため、親Frameとの通信を維持するための正しい方法です( Safariの制限)。

カスタム ページのJavaScriptとHTMLをロードするという 2 つの要求を行う必要があります。すべてが問題ないことを確認するために、最初にJavaScriptをロードしてからHTMLをロードします ( JavaScript onload コールバックで)。しかし、これら2つのリクエストを同時に送信したいと思います。

コードを用意しました。JavaScriptとHTMLの両方がロードされたら、スクリプトは_finishLoading()を呼び出す必要があります。関数_finishLoading()がブラウザで実行されない可能性はありますか?

 function Loader()
 {
       this.load = function()
       {
                    // ...some code here...

        var this_ = this;

        var jsLoaded = false;
        var htmlLoaded = false;

        $.ajax(
            url: newUrl,
            dataType: "jsonp",
            jsonpCallback:
                function()
                {
                    $.ajax(
                        url: someUrl,
                        dataType: "html",
                        success:
                            function( data )
                            {
                                $( '#' + contentElId ).html( data );

                                if( htmlLoaded )
                                {
                                    this_._finishLoading()
                                }

                                jsLoaded = true;
                            }
                    );
                }
        );

        $.ajax(
            {
                url: someUrl2,
                dataType: "html",
                success:
                    function( data )
                    {
                        $( '#' + contentElId ).html( data )

                        if( jsLoaded )
                        {
                            this_._finishLoading()
                        }

                        htmlLoaded = true;
                    }
            }
        );
    }

}

更新します。

JavaScript、HTML をロードしてから、onload() を呼び出して、ロードされた Javascript を初期化する必要があります。より便利な方法を知っている場合は、それらを別々にロードしてください。

4

1 に答える 1

1

$.when()関数の使用を検討する

コードは次のようになります。

        var this_ = this;

        var jsLoaded = false;
        var htmlLoaded = false;
        var deferred = $.Deferred();
        $.ajax(
            url: newUrl,
            dataType: "jsonp",
            jsonpCallback:
                function()
                {
                    $.ajax(
                        url: someUrl,
                        dataType: "html"
                        success: function(){
                           deferred.resolve();
                        }
                    );
                }
        );

        var promise2 = $.ajax(
            {
                url: someUrl2,
                dataType: "html",
            }
        );

        $.when(deferred, promise2).done(function(a1, a2){
           $( '#' + contentElId ).html(a1);
           $( '#' + contentElId ).html(a2);
           this_._finishLoading()
        });
于 2013-07-13T11:27:40.907 に答える