embed a jquery script after jquery is loaded by widget
- by matthew k
http://stackoverflow.com/a/6065421 was helpful to see how to confirm jquery has been loaded.
my widget will need a class that was written using jquery. may i have some assistance on embedding this other class built using jquery?
thank you,
below is the snippet from the above link with my code added in the final portion as noted in the code comments:
(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.
});
right now, i am trying the following based on the response(s) provided to this question (line that throws error is noted with a comment):
//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
});
});
});
}