1

これは単純なはずですが、SOに関する古い回答の多くは少し間違っているようです。ライブラリ、一部のプラグイン、および一部のコードを非同期でロードできるようにしたいのですが、それらが順番に実行されていることを確認してください。

スクリプトはロードされるたびに実行され、リストされている順序ではない可能性があるため、この種のことは機能しません。

if (someCondition) {
  $.ajax({
    url: "theLibrary.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("library loaded and executed");
    }
  });
  $.ajax({
    url: "thePlugin.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("plugin loaded and executed");
    }
  });
  $.ajax({
    url: "theCode.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("code loaded and executed");
    }
  });
}

これを最初に突き刺すのは、次のようにコールバックで依存関係をネストすることです。

if (someCondition) {
  $.ajax({
    url: "theLibrary.js",
    dataType: "script",
    cache: true,
    success: function(data) {
      console.log("library loaded and executed");
        $.ajax({
          url: "thePlugin.js",
          dataType: "script",
          cache: true,
          success: function(data) {
            console.log("plugin loaded and executed");
            $.ajax({
              url: "theCode.js",
              dataType: "script",
              cache: true,
              success: function(data) {
                console.log("code loaded and executed");
              }
            });
          }
        });
    }
  });
}

これで実行の問題は解決しましたが(読むのは大変ですが)、問題はloading、前のスクリプトがロードされて実行されている間、2 番目と 3 番目のスクリプトが停止することです。つまり、読み込みと実行が完全に分離されていません。

.ajaxまたはその短縮形の継子.getScriptに実行を遅らせるオプションがないようです。ドキュメントから:

dataType: "script": 応答を JavaScript として評価し、プレーン テキストとして返します。

つまり、ロードと実行は完全に結合されているように見えます。追加のスクリプト読み込みライブラリなしで、 jquery のみを使用して、深くネストされた依存関係のこの種の状況を処理するクリーンな方法はありますか?

4

1 に答える 1