Databases
StackOverflow2013
Postsdbo
POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
    primarykey
    data
    text
    <p>I have a simple function which causes a Stack Overflow error in IE 8. The problem does not appear to occur in any other browser although I have not testing IE 7 or 6.</p> <p>The exact error is as follow:- </p> <pre><code> SCRIPT28: Out of stack space jquery.min.js, line 2 character 7498 SCRIPT2343: Stack overflow at line: 2 </code></pre> <p>The function in question:</p> <pre><code>function switchImage(size, objid, prefix, fullimage){ if(size !== 'full'){ var image = prefix + size + '/' + size +'_' + fullimage; } else { var image = prefix + size + '/' + fullimage; } $('#' + objid).data('type', size) .append('&lt;img id="preload" src="' + image + '" style="display:none;" /&gt;') .find('#preload').load(function(){ $('#' + objid).find('img').attr('src', image); $(this).remove(); }); } </code></pre> <p>To give an overview of the use case I will explain the purpose of this function:</p> <p>When a user resizes an image (using jqueryUI resize) the width/height is compared in another function.</p> <p>Once the image grows to be of a certain size this function is then called which as you can see, appends a hidden <code>&lt;img&gt;</code> element to the DOM with the 'src' attribute of a higher resolution version of the image (or lower if the image is being downsized by the user.</p> <p>Once it has been loaded the src attribute of the visible element is updated and the hidden element is removed.</p> <p>This proved excellent dynamic switching of images as the user resizes them keeping the image quality good throughout the process....</p> <p>I just can't seem to work out what is causing the problem in IE 8. With this function removed no errors occur, and although the error is present, the function still works as it should (although resize performance is poor anyway in IE 8).</p> <p>Any help would be greatly appreciated.</p> <p><strong>UPDATE:</strong> I seem to have solved the original issue by rewriting the function to the following:-</p> <pre><code>function switchImage(size, objid, prefix, fullimage){ var $el = $('#' + objid); if(size !== 'full'){ var image = prefix + size + '/' + size +'_' + fullimage; } else { var image = prefix + size + '/' + fullimage; } $el.data('type', size); $('&lt;img id="preload" src="' + image + '" style="display:none;" /&gt;') .appendTo($el) .one('load', function(){ $('#' + objid).find('img').attr('src', image); $(this).remove(); }); } </code></pre> <p>As you can see, the only real difference is that I am using .appendTo() rather than .append() as well as using jQuery .one() method to ensure that the load event only occurs once. Though since the element is removed directly afterwards I don't understand why this should make any difference.</p> <p>I really would be interested to see if anyone can shed any light on this so I can learn how to avoid such issues in the future. Cheers.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USgordyr
    1. USgordyr
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
      1. This table or related slice is empty.
      1. VTUpMod
    1. COWhat happens when you use a non-minfied version of jQuery? At least that way you'll get a more meaningful reference for the error.
      singulars
      1. POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
      1. USRobG
    2. COThe same thing happens.... Believe it or not five minutes after posting the question... I have solved it. But I have no idea why... I will update my question, as I would really like to understand why this slight rewrite has made a difference.
      singulars
      1. POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
      1. USgordyr
    3. CO@gordyr Can you give us the code that calls the function switchImage() to give me some context?
      singulars
      1. POWhy is my jQuery function causing a 'Stack Overflow' error in IE 8?
      1. USdane fairbanks
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload