javascript - 未捕获的类型错误 : Can not set propery 'FUNCTION_NAME' of undefined for widget implementation

Question

我正在尝试开发一个可以嵌入到任何站点的 jQuery 小部件。以下是脚本代码:

(function($) {
    var jQuery;
    if (window.jQuery === undefined || window.jQuery.fn.jquery !== '1.6.2')
    {
        var script_tag = document.createElement('script');
        script_tag.setAttribute("type","text/javascript");
        script_tag.setAttribute("src","http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js");
        script_tag.onload = scriptLoadHandler;
        script_tag.onreadystatechange = function () 
        { 
            if (this.readyState == 'complete' || this.readyState == 'loaded')
                scriptLoadHandler();
        };
        (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
    }
    else 
    {
        jQuery = window.jQuery;
        main();
    }
    function scriptLoadHandler() 
    {
        jQuery = window.jQuery.noConflict(true);
        main();
    }
    function main() {
        jQuery(document).ready(function($) {
            var css = $("<link>", { rel: "stylesheet", type: "text/css", href: "http://mysite.com/my_css_path.css" });
            css.appendTo('head');
        });
        $.fn.fetchfeed = function(options) {
            var defaults = {
                //default params;
            };
            var opts = $.extend(defaults, options);

            var myURL = "http://mysite.com/"+opts.user+".json?";
            var params = "&callback=?"
            var jsonp_url = myURL + encodeURIComponent(params);

            $.getJSON(jsonp_url, function(data) {
                //build widget html
            })
            .error(function() {
                //show error
            });
        }
    }
})(jQuery);

下面是需要放在用户站点的代码:

 <script id='mywidgetscript' src='http://my_site.com/javascripts/widget.js'></script>
 <div id='my-widget-container'></div>
 <script>$('#my-widget-container').fetchfeed({/*parameters*/});</script>

当我将此代码放在其他站点上并尝试加载小部件时，它会出现 Uncaught TypeError: Can not set property 'fetchfeed' of undefined 错误并且无法加载小部件。有什么问题吗？

令人惊讶的是，这个小部件代码在本地主机上的我的站点上运行!!!

Answer 1

如果 jQuery 在您的代码执行之前未定义，那么您会在此处得到 TypeError:

$.fn.fetchfeed

因为 $ 不是 jQuery 对象。尝试将 main() 中的这一行和后续代码移动到上面的 jQuery(document).ready(function($){ ... }); 构造中。