的Widget大厦：遗漏的类型错误：对象的翻译：有没有方法“的fancybox”

Question

为什么说这个工程：http://jsfiddle.net/w82W8/1/ 但这不？：http://jsfiddle.net/w82W8/2/

这个问题似乎令人费解;你可能会想，为什么不使用第一个！？为什么您使用jQuery加载可以轻松加载到原始HTML中的JS + CSS资源。

那么，我正在建立一个Web小部件的过程中，我想保持尽可能小的嵌入代码。这个想法是让用户在其代码中包含一行<script type='text/javascript' src='http://mysite.com/widget.js'></script>行，并且widget.js代码将处理所有的细节。包括提取fancybox。

，我发现了错误：遗漏的类型错误：对象的翻译：已经没有法“的fancybox”

我推测，JavaScript并不是等待fancybox.js加载，并立即尝试应用fancybox（）到触发器。资产加载完成后，我可以在这里获得回拨吗？我敢肯定，他们正在包含在DOM中，但我已经使用Chrome Tools进行了检查。

我知道这个问题已经问StackOverflow之前，但不是在这种情况下。

谢谢，祝你节日快乐！

Answer 1

在第二种方法中，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 
});