IE 7 "stop running this script" error using jQuery

Question

I can't seem to find what is causing this error in IE 7 works in Chrome. When loading my page in internet explorer it pops up the error "stop running this script message". Any ideas?

 $(document).ready(function() {
    var icons = {
    header: "ui-icon-circle-plus",
    headerSelected: "ui-icon-circle-minus"
    };  

   $('.ui-accordion').accordion({
   active: false,
   collapsible: true,
   autoHeight: false,
   icons: icons
   });

   $("a").click(function (event) {
    event.stopPropagation();
   });

   $('.requirementCheckBox').click(function() {
     getReq();
   });
 });


function getReq() {

  var componentList;
  var selected = $(":checkbox:checked");

  if(selected.length ==0){
    $('#requirements_table_wrapper').remove();
  }

  else {
    $.each(selected , function(i, n){

    if(i == 0){
      componentList = n.value;
    }
    else{
      componentList += ',' + n.value;
    }
 });


$.getJSON("addRequirements/GetRequirements/?componentList=" + componentList, function    (data) {

  $('#requirements_table_wrapper').remove();

    var reqString = '<table id="requirements_table"><thead><tr><th>Requirement ID</th><th>Requirements</th><th>Reference</th></tr></thead><tbody>';

    for (var i = 0; i < data.length; i++) {
      reqString += '<tr><td>'+ data[i].reqID  + '</td><td>' + data[i].reqText + '</td>' + '<td>' + data[i].reqReference + '</td></tr>';
    }

    reqString += '</tbody></table>';

    $("#requirementsDiv").append(reqString);

    $("#requirements_table").dataTable({
        "bJQueryUI": true,
        "bPaginate": false,
        "bRetrieve": true,
    "oLanguage": {"sSearch" : "Filter Requirements:"}
    });

  });
}

}

I don't immediately spot any infinite loops but maybe I have been staring at it too long.

**UPDATE The problems seems to be with the accordion, once it is removed IE loads the page normally.

Try $("#requirementsDiv").html(reqString); instead of .append. I recommend using this, especially when the div is empty before appending. — Rob W
– Rob W, Commented Nov 1, 2011 at 21:03
I asked a similar question and I was also using accordion, so stackoverflow.com/questions/6006406/… if it helps! — meder omuraliev
– meder omuraliev, Commented Nov 1, 2011 at 21:11
@RobW this could be the answer, please consider posting this as an answer. append has to create many document fragments and this could take a while. — topek
– topek, Commented Nov 1, 2011 at 21:13
@meder ,it looks like the accordion is the problem. what did you end up doing as I didn't see you select an answer on your post. — marknery
– marknery, Commented Nov 2, 2011 at 15:33

Rob W · Accepted Answer · 2011-11-01 21:19:03Z

4

Use $("#requirementsDiv").html(reqString); instead of the .append() method.

$elem.html(string) is equivalent to elem.innerHTML = string.
$elem.append(string) first converts the string to a DOM element, then appends the elements to the HTML using the DOM .appendChild() methods.

Since you're executing the code at page load, it's very likely that the contents of the div is empty. If the div is not empty, but doesn't contain event-handlers and such, also use .html():

var $elem = $("#requirementsDiv");
$elem.html($elem.html() + reqString);

answered Nov 1, 2011 at 21:19

Rob W

350k87 gold badges811 silver badges683 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

scrappedcola · Accepted Answer · 2011-11-01 21:06:43Z

One immediate place where I see room for improvement is where you are concatinating your reqString using + and +=. Don't do that, instead push each piece onto an array and then join the array on "", and then append to your doc.

var reqString = ['<table id="requirements_table"><thead><tr><th>Requirement ID</th><th>Requirements</th><th>Reference</th></tr></thead><tbody>'];

    for (var i = 0; i < data.length; i++) {
      reqString.push('<tr><td>', data[i].reqID, '</td><td>', data[i].reqText,'</td>','<td>', data[i].reqReference, '</td></tr>');
    }

    reqString.push('</tbody></table>');
$("#requirementsDiv").append(reqString.join(""));

Another place to look would be your use of $.each. Try changing it to a regular for loop as the $.each isn't always as efficient as for.

As a side note you have an error in your script where you add '})' to close out getReq.

topek · Accepted Answer · 2011-11-01 21:06:16Z

0

It does not have to be an infinite loop, but some part of your script that takes too long.

Try to remove parts of the script until the error goes away, then you will have found the part you need to optimize.

You have two loops that should be considered first:

$.each(selected , function(i, n){

and

for (var i = 0; i < data.length; i++) {

The second can be slightly optimized by using an array, if the data array is really large:

var reqArray = ['<table id="requirements_table"><thead><tr><th>Requirement ID</th><th>Requirements</th><th>Reference</th></tr></thead><tbody>'];

for (var i = 0; i < data.length; i++) {
  var element = data[i]
  reqString.push('<tr><td>'+ element.reqID  + '</td><td>' + element.reqText + '</td>' + '<td>' + element.reqReference + '</td></tr>');
}

var regString = regArray.join('') + '</tbody></table>';

But I don't think that this will remove the problem. Still worth a try.

answered Nov 1, 2011 at 21:06

topek

19k3 gold badges38 silver badges43 bronze badges

2 Comments

scrappedcola Over a year ago

If you are going to use an array you should also push each individual string piece rather than concatenating before the push, even with just 5 pieces. It will improve performance in IE7 especially.

topek Over a year ago

This true, but micro optimization. As mentioned in my post I don't think that this loop could lead to the problem. @crocaduck81 should simply try to locate the problematic lines first. I do think, as commented on the post, that the main problem could lie in the append call.

Collectives™ on Stack Overflow

IE 7 "stop running this script" error using jQuery

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related