2

javascript で変数を初期化しようとしており (具体的には、jQuery テンプレート プラグインでリモート テンプレートを使用したい)、複数の非同期コールバックが初期化されるのを待ってから続行します。私が本当に望んでいるのは、<script type="text/x-jquery-tmpl" src="/my/remote_template">タグを介してリモート テンプレートにリンクできるようにすることですが、pthread_once.

理想的には、API は次のようになります。

$.once(function_to_be_called_once, function_to_be_called_after_first)

そして次のように使用されます：

var remote_template = "";

function init_remote_template() {
    remote_template = $.get( {
        url: "/my/remote/template",
        async: false
    });
}

$.once(init_remote_template, function () {
     // Add initial things using remote template.
});

その後、別の場所で:

$.get({
    url: "/something/that/requires/an/asynchronous/callback",
    success: function () {
        $.once(init_remote_template, function () {
              // Do something using remote template.
        }
    }
});

そのようなものは存在しますか？

4

2 に答える 2

3

jQueryの約束がここであなたを助けることができるように見えます：

var templatePromise = $.get({
    url: "/my/remote/template"
});

templatePromise.done(function(template) {
     // Add initial things using remote template.
});

そしてあなたがすることができる他の場所：

$.get({
    url: "/something/that/requires/an/asynchronous/callback",
    success: function () {
        templatePromise.done(function(template) {
              // Do more things using remote template.
        });
    }
});

通常$.get（および$.ajaxなど）は、最初の呼び出しでコールバックとともに使用されsuccess:ますerror:が、$。Deferredのように機能するpromiseオブジェクトも返します。ここに記載されています：http：//api.jquery.com/category/deferred-object /それはあなたがあなたが求めていることをすることを可能にします。エラー処理には、イニシャルを使用するtemplatePromise.fail(...)か、単に追加することができます。error: ...$.get

一般に、同期AJAX呼び出しは避けるのが最善です。これは、HTTP要求の処理中に、ほとんどのブラウザーのインターフェースがブロックされるためです。

于 2013-01-04T07:05:58.767 に答える
0

私が正しく理解していれば、jQuery は Deferreds/promise を介して、あなたが望むことを行います。

リモート テンプレート フェッチャーを一般化することもできます。

  • 任意の数のテンプレートをキャッシュする js プレーン オブジェクトを使用する
  • 関数の名前を変更し、それに URL を渡します。get_remote_template(url)

js:

var template_cache = {};//generalised template cache

//generalised template fetcher
function get_remote_template(url) {
    var dfrd = $.Deferred();
    if(!template_cache[url]) {
        $.get(url).done(function(tpl) {
            template_cache[url] = tpl; //we use the url as a key.
            dfrd.resolve(tpl);
        });
    }
    else {
        dfrd.resolve(template_cache[url]);
    }
    return dfrd.promise();
}

それで ：

var url1 = "/my/remote/template"; //the url of a particular template

get_remote_template(url1).done(function(tpl) {
    // Add initial things using tpl.
});

そして、早いか遅いか：

$.get({
    url: "/something/that/requires/an/asynchronous/callback",
    success: function(data) {
        init_remote_template(url1).done(function (tpl) {
            // Do something using tpl (and data).
        });
    }
});

get_remote_template()promise を返す方法に注意してください。要求されたテンプレートが既にキャッシュされている場合、promise はすぐに解決されて返されます。テンプレートがまだキャッシュにない場合 (つまり、サーバーからダウンロードする必要がある場合)、promise はしばらくしてから解決されます。いずれにせよ、promise が返されるという事実により、.done()コマンドを連鎖させ、適切なテンプレートにアクセスして使用することができます。

編集

@BenAlpert のポイントを取り入れて、このバージョンは tpl 自体ではなく、tpl に関連付けられた promise をキャッシュします。

var template_cache = {};//generalised cache of promises associated with templates.

//generalised template fetcher
function get_remote_template(url) {
    if(!template_cache[url]) {
        template_cache[url] = $.get(url);
    }
    return template_cache[url];//this is a promise
}

このバージョンのget_remote_template()は、上記と同じ方法で使用されます。

于 2013-01-04T07:32:03.040 に答える