2

https://stackoverflow.com/a/6065421有助于了解如何确认 jquery 已加载。我的小部件将需要一个使用 jquery 编写的类。我可以在嵌入使用 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 = "/media/jquery.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", function($, jquery_loaded) { //my code added below
    var script_tag = document.createElement('script');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute("src", "http://mysite.com/widget/slides.jquery.js");
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);

$('#slides').slides({}); //this line gives an error.
});

现在，我正在根据提供给该问题的响应尝试以下操作（引发错误的行带有注释）：

//this function is called after jquery being embedded has been confirmed. {mysite} placeholder is nonexistent in actual code.
function main() {
jQuery(document).ready(function($) {
    var css_link = $("<link>", {
        rel: "stylesheet",
        type: "text/css",
        href: "http://mysite/widget/widget.css"
    });
    css_link.appendTo('head');

    $('#crf_widget').after('<div id="crf_widget_container"></div>');

    /******* Load HTML *******/
    var jsonp_url = "http://mysite/widget.php?callback=?";
    $.getJSON(jsonp_url, function(data) {
        $('#crf_widget_container').html(data);

        $('#category_sel').change(function(){
            alert(this.value);
        });

        $.getScript("http://mysite/widget/slides.jquery.js", function(data, textStatus, jqxhr) {
            alert(1); //fires ok
            $('#slides').slides({}); //errors
        });
    });
});
}

error 1: $ is undefined .../slides.jquery.js?_=1341349267810 Line 22
error 2: $("#slides").slides is not a function .../widget.js?1341349266628 Line 61

$('#slides').slides({}); 当我测试小部件的工作原理时工作。然而，当把它变成一个小部件时，上面的错误就是我所面临的。

有更多建议的人吗？

等了几个星期后，我刚刚从我需要的 jquery 类中获取代码，并在 jquery 的负载得到确认后将其放入正文中。我宁愿在加载 jquery 后导入 jquery 类，但我想不通。

4

2 回答 2

2

由于您已经加载了 jQuery，因此使用该$.getScript()函数获取slides.jquery.js文件可能会更容易 - 如下所示：

<!-- language: lang-js -->
(function(window, document, version, callback) {
    var j, d, loaded = false;
    if (!(j = window.jQuery) || version > j.fn.jquery || callback(j, loaded)) {
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "/media/jquery.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", function($, jquery_loaded) { //my code added below
    // use $.getScript
    $.getScript("http://mysite.com/widget/slides.jquery.js", function(data, textStatus, jqxhr) {
        $('#slides').slides({});
    });
});
于 2012-07-03T02:24:29.780 回答
0

等了几个星期后，我刚刚从我需要的 jquery 类中获取代码，并在 jquery 的负载得到确认后将其放入正文中。我宁愿在加载 jquery 后导入 jquery 类，但我想不通。

于 2012-07-12T20:35:32.767 回答