ウィジェットビル：キャッチされない例外TypeError：オブジェクト[オブジェクトのオブジェクト]は何のメソッド「fancybox」を持っていない

Question

なぜそれがこの作品ということである：http://jsfiddle.net/w82W8/1/ しかし、これはhttp://jsfiddle.net/w82W8/2/

を?:ていません。この問題は複雑に見えるかもしれません。あなたは最初に使ってみませんか？なぜ、元のHTMLに簡単にロードできるJS + CSSアセットを読み込むためにjQueryを使用していますか？

私はWebウィジェットを構築中です。できるだけ埋め込みコードを小さくしたいと思います。この考え方は、ユーザーにコードに<script type='text/javascript' src='http://mysite.com/widget.js'></script>という行を1つ含めることで、widget.jsコードはすべての詳細を処理します。フェッチするfancyboxを含む。

私はエラーを取得しています：キャッチされない例外TypeErrorを：オブジェクト[オブジェクトのオブジェクト]は何の方法「fancybox」

を持っていない私にはJavaScriptをfancybox.jsがロードされるのを待っている、とすぐに適用しようとしていないと仮定fancybox（）をトリガーに追加します。アセットが読み込まれたときにここでコールバックを取得できますか？私は彼らがDOMに含まれていると確信しています...私はChromeのツールで検査しました。

私はこの質問がこの文脈ではなく、前にStackOverflowで尋ねられていることを知っています。

ありがとう、そしてハッピーホリデー！

Answer 1

第2の方法では、Fancyboxプラグインがロードされる前にfancyboxメソッドが呼び出されます。スクリプトをロードした後にコードを実行する場合は、getScriptメソッドを使用してください。

例：

$.getScript(
    "http://jordanarsenault.com/fancy/fancybox.js", 
    function(){ 
     $(".trigger").fancybox(); 
    } 
); 

あなたは高度なリソースローダーが必要な場合は、そのようyepnopeとして、実際のローダーを使用することを検討してください。

Answer 2

スクリプトがすぐにロードされないためです。 $.getScriptを使用し、http://jsfiddle.net/w82W8/3/のようなコールバックを提供する必要があります。

$.getScript("http://jordanarsenault.com/fancy/fancybox.js", function() { 
    $(".trigger").fancybox(); // only run when script is loaded 
});