Search jQuery

jQuery Forum

Using jQuery

djfonplaz

jQuery.noConflict() vs Ajax : variable scope limited?

in Using jQuery • 10 years ago

This is my code that load (if not present) jquery library :

(function () {
var pathWidget = "http://www.mywebsite.com";
var jQuery;
if (window.jQuery === undefined) {
var script_tag = document.createElement('script');
script_tag.setAttribute("type", "text/javascript");
script_tag.setAttribute("src", pathWidget + "/scripts/jquery-1.7.2.min.js");
if (script_tag.readyState) {
script_tag.onreadystatechange = function () {
if (this.readyState == 'complete' || this.readyState == 'loaded') {
scriptLoadHandler();
}
};
} else {
script_tag.onload = scriptLoadHandler;
}
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
} else {
jQuery = window.jQuery;
mainWidget();
}
function scriptLoadHandler() {
jQuery = window.jQuery.noConflict(true);
mainWidget();
}
function mainWidget() {
jQuery(document).ready(function ($) {
var widget_url = pathWidget + "/widget/widget.aspx?&callback=?"
$.getJSON(widget_url, function (data) {
$('#container').html(data.htmlWidget);
});
});
}
})();

This is the code loaded trought ajax/jsonp :

<div id="exDiv">First</div>
<script type="text/javascript">
$('#exDiv').html("Second");
</script>

The problem is : if the host page doesnt have jquery, when the aspx code try to execute `$('#exDiv')`, it "crash", and I get `$ is not a function`. Seems that after the ajax call the `$` setted as no-conflict variable is vanished.

How can I resolve this trouble?