2010-12-13 20 views
7

どのような環境でも、サードパーティのサイトに埋め込み可能なJavaScriptウィジェットを作成しました。このウィジェットは、jQueryとjQuery UIに依存しています。私はHow to embed Javascript widget that depends on jQuery into an unknown environmentの手順を踏んでjQueryを責任ある方法で追加しました.jQueryを組み込むのに最適です。しかし、jQuery UIを追加しようとすると失敗します。ここでは、コードです:私はこれを実行するとjQuery UIにjQueryが表示されないのはなぜですか?

(function(window, document, version, callback) { 
    var j, d; 
    var loaded = false; 
    if (!(j = window.jQuery) || version > j.fn.jquery || callback(j, loaded)) { 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"; 
    script.onload = script.onreadystatechange = function() { 
     if (!loaded && (!(d = this.readyState) || d == "loaded" || d == "complete")) { 
      callback((j = window.jQuery).noConflict(1), loaded = true); 
      j(script).remove(); 
     } 
    }; 
    document.documentElement.childNodes[0].appendChild(script) 
    } 
})(window, document, "1.3.2", function($, jquery_loaded) { 
    $.getScript('http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js', function(){ 
     console.log('loaded'); 
    }); 
}); 

が、私はjqueryの-ui.jsの15行目の「$が未定義である」というエラーが続く「ロードされた」メッセージを指定し、取得します。しかし、$ .getScript()を使ってjQuery UIをロードすると$はどうやって定義できないのですか?エラーが表示される前に、なぜ「読み込まれました」というメッセージが表示されるのですか? jQueryのドキュメントによると、getScriptはスクリプトがロードされて実行されるまでコールバックを実行しません。

このフレームワークを使用してjQuery UIを組み込む方法はありますか、またはすべてをロードしたり、依存関係を強制するためにRequireJSのようなスクリプトローダーを使用する必要がありますか?

答えて

7

.noConflict(true)と同じ)を呼び出すと、jQueryを削除しているので、1を削除してください。 trueの引数が.noConflict()の場合、$が削除されるだけでなく、がロードされるときに、jQuery UIが後で使用しようとしているwindow.jQueryが削除されるようにjQueryに指示します。

You can test it here、コンソールにエラーはありません。

+0

bah!それはそれだった。 FF/Chrome/Safariにうまく読み込んでいます。 – venutip

+0

+1のために+1:Nick Craverのために – alex

+0

+。 –

関連する問題