2

私のユーザー スクリプトでは、このコードを使用して、jQuery と残りのコードを挿入して実行します。

function addJQuery(callback) {
  var script = document.createElement("script");
  script.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js");
  script.addEventListener('load', function() {
    var script = document.createElement("script");
    script.textContent = "(" + callback.toString() + ")();";
    document.body.appendChild(script);
  }, false);
  document.body.appendChild(script);
}
function readyJQuery() {
  jQuery.noConflict();
  jQuery(document).ready(function() {
    //my rest code goes here
  })
}
addJQuery(readyJQuery)


これは完全に機能します。しかし、2 つのスクリプトがある場合、両方とも jQuery 部分を挿入します。誰がどのスクリプトを使用したいのか、または両方のスクリプトを使用したいのかわからないため、スクリプトは別々にする必要があります。

2 番目のスクリプトが jQuery を挿入するのを防ぎ、最初のスクリプトのスクリプトを使用することはできますか?

2 番目のスクリプトが次のように直接始まる場合:

function addJQuery(callback) {
  var script = document.createElement("script");
  script.textContent = "(" + callback.toString() + ")();";
  document.body.appendChild(script);
}
function readyJQuery() {
  jQuery.noConflict();
  jQuery(document).ready(function() {
    //my rest code goes here
  })
}
addJQuery(readyJQuery)

コンソールにエラー メッセージが表示されます: jQuery is undefined。別のスクリプトがすでに jQuery を挿入しているかどうかをテストし、準備が整うまで待つにはどうすればよいですか?

4

2 に答える 2

1

jQuery に一意の識別子を付け、その識別子を確認し、見つからない場合にのみ jQuery を追加します。また、最初の jQuery が初期化されるまで十分な時間を確保する必要があります。

両方のスクリプトで次のように変更addJQuery()すると、テストで機能します。

function addJQuery (callback) {
    //--- Has jQuery already been added?
    var jqNode  = document.querySelector ("#myAddedJQ");
    if (jqNode) {
        FireCallback (callback);
    }
    else {
        //--- Wait a bit to be sure.
        setTimeout ( function() {
                var jqNode  = document.querySelector ("#myAddedJQ");
                if (jqNode) {
                    FireCallback (callback);
                }
                else {
                    var script  = document.createElement ("script");
                    script.id   = "myAddedJQ";
                    script.setAttribute (
                        "src",
                        "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"
                    );
                    script.addEventListener ('load', function () {
                        FireCallback (callback);
                    }, false);
                    document.body.appendChild (script);
                }
            }
            , 444
        );
    }

    function FireCallback (callback) {
        var script          = document.createElement ("script");
        script.textContent  = "                                         \
            if (typeof waitForJqDefined == 'undefined') {               \
                var waitForJqDefined    = setInterval ( function () {   \
                        if (typeof jQuery != 'undefined') {             \
                            clearInterval (waitForJqDefined);           \
        ";
        script.textContent += "\n(" + callback.toString() + ")();\n";
        script.textContent += "                                         \
                        }                                               \
                    },                                                  \
                    50                                                  \
                );                                                      \
            }                                                           \
            else {                                                      \
        ";
        script.textContent += "\n(" + callback.toString() + ")();\n";
        script.textContent += "                                         \
            }                                                           \
        ";
        document.body.appendChild (script);
    }
}
于 2012-04-21T04:40:09.813 に答える
0

スクリプトを挿入して jQuery をロードする前に、jQuery が既に存在するかどうかを確認してみませんか?

競合状態が心配な場合: 両方のスクリプトが同時にロードしようとしている場合 - グローバル スコープでフラグを設定することでその競合状態を絞り込み、それを確認することもできます。競合状態は解消されませんが、役立つ場合があります。

if ( typeof jQueryLoading == 'undefined')
   var jQueryLoading = false;
if ( typeof jQuery == 'undefined' && jQueryLoading == false )
{
  jQueryLoading = true;
  //Load it yourself, then add scripts
}
else
{
  //No problems. Add your scripts
}
于 2012-04-21T04:30:05.123 に答える