Friday, February 23, 2024
 Popular · Latest · Hot · Upcoming
138
rated 0 times [  144] [ 6]  / answers: 1 / hits: 29406  / 15 Years ago, fri, march 27, 2009, 12:00:00

I have a page that dynamically adds script references via jQuery's $.getScript function. The scripts load and execute fine, so I know the references are correct. However, when I add a debugger statement to any of the scripts to allow me to step through the code in a debugger (such as VS.Net, Firebug, etc.), it doesn't work. It appears that something about the way jQuery loads the scripts is preventing debuggers from finding the files.



Does anybody have a work-around for this?


More From » jquery

 Answers
189

Ok, so it turns out that the default implementation of the $.getScript() function works differently depending on whether the referenced script file is on the same domain or not. External references such as:



$.getScript(http://www.someothersite.com/script.js)


will cause jQuery to create an external script reference, which can be debugged with no problems.



<script type=text/javascript src=http://www.someothersite.com/script.js></script>


However, if you reference a local script file such as any of the following:



$.getScript(http://www.mysite.com/script.js)
$.getScript(script.js)
$.getScript(/Scripts/script.js);


then jQuery will download the script content asynchronously and then add it as inline content:



<script type=text/javascript>{your script here}</script>


This latter approach does not work with any debugger that I tested (Visual Studio.net, Firebug, IE8 Debugger).



The workaround is to override the $.getScript() function so that it always creates an external reference rather than inline content. Here is the script to do that. I have tested this in Firefox, Opera, Safari, and IE 8.



<script type=text/javascript>
// Replace the normal jQuery getScript function with one that supports
// debugging and which references the script files as external resources
// rather than inline.
jQuery.extend({
getScript: function(url, callback) {
var head = document.getElementsByTagName(head)[0];
var script = document.createElement(script);
script.src = url;

// Handle Script loading
{
var done = false;

// Attach handlers for all browsers
script.onload = script.onreadystatechange = function(){
if ( !done && (!this.readyState ||
this.readyState == loaded || this.readyState == complete) ) {
done = true;
if (callback)
callback();

// Handle memory leak in IE
script.onload = script.onreadystatechange = null;
}
};
}

head.appendChild(script);

// We handle everything using the script element injection
return undefined;
},
});
</script>

[#99787] Friday, March 20, 2009, 15 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
zackeryzainv

Total Points: 61
Total Questions: 102
Total Answers: 99

Location: Andorra
Member since Sat, May 27, 2023
10 Months ago
;