Thanks for the reply. I will try it and let you know how it goes.
On Feb 12, 2:02 pm, James <james.gp....@gmail.com> wrote: > Try looking into using Event Delegation for managing your events. This > means, instead of attaching events to a specific elements (thus, many > attachments and more processing time), you're attaching just a single > event to the parent element and take actions for the children's > events. Here are some links to > help:http://www.learningjquery.com/2008/03/working-with-events-part-1http://lab.distilldesign.com/event-delegation/ > > On Feb 12, 10:30 am, zenbaida <zenba...@gmail.com> wrote: > > > I have a table that I am parsing with jQuery. The table is used to > > show data related to various objects. It alternates between a row with > > applicable data, and a hidden row that contains other details. The > > main body of the table is built with multiple html blocks like so: > > > <tr class="text3" valign="top" id="row01"> > > <td id="arrow-row01"><div><img > > src="/d-elearn/intranet/inv2/themes/ > > default/icons/general/disabled_arrow.png" alt="Detail Toggle Icons > > Column" width="16" height="16" /></div></td> > > <td><div class="inUse">In Use</div></td> > > <td>{some data}</td> > > <td>{more data}</td> > > <td>{data}</td> > > <td>{data}</td> > > <td>{data}</td> > > <td class="optionCell">{Options for data go here}</td> > > </tr> > > <tr id="detail-row01" class="details"> > > <td colspan="8">{Bunch of detail stuff goes here</td> > > </tr> > > > Here is the code that parses the above html: > > > function setDetail() > > { > > // for the arrow detail toggles > > $('table').find('tr').each(function(i) > > { > > var rowId = $(this).attr('id'); > > //if(i < 5) alert(trId.match('detail')); > > if(rowId && !rowId.match('detail')) > > { > > var imageRow = '#' + rowId; > > var imageCellId = '#arrow-' + rowId; > > var imageCellImage = imageCellId + ' div img'; // > > the detail arrow > > icon > > var imageCellDiv = imageCellId + ' div'; // the > > detail arrow icon > > container > > var detailDiv = '#detail-' + rowId; > > $(detailDiv).hide(); // hide the details > > $(imageCellImage).hide(); > > > > $(imageCellDiv).addClass('arrowHidden').css({width:'20px', > > height:'18px'}).hover(function() > > { > > if($(imageRow).attr('class') != > > 'text2') > > { > > > > $(imageRow).attr('class','text4'); > > > > $(imageCellDiv).removeClass('arrowHidden'); > > } > > else > > { > > > > $(imageCellDiv).removeClass('arrowShow'); > > } > > > > $(imageCellDiv).addClass('arrowActive'); > > }, > > function() > > { > > if($(imageRow).attr('class') != > > 'text2') > > { > > > > $(imageRow).attr('class','text3'); > > > > $(imageCellDiv).removeClass('arrowActive'); > > > > $(imageCellDiv).addClass('arrowHidden'); > > } > > else > > { > > > > $(imageCellDiv).removeClass('arrowActive'); > > > > $(imageCellDiv).addClass('arrowShow'); > > } > > } > > ).click(function() > > { > > if($(imageRow).attr('class') == > > 'text2') > > { > > > > $(imageRow).attr('class','text4'); > > $(detailDiv).hide(); > > } > > else > > { > > > > $(imageRow).attr('class','text2'); > > $(detailDiv).show(); > > } > > > setFooter(); // re-calculate the > > footer possition > > } > > ); > > } > > }); > > > } > > > The table that I have the biggest issue with is the one that has about > > 160 such html blocks (so about 320 total rows). jQuery 1.2.6 goes > > through and parses the table very quickly with no issues. When do the > > same thing using jQuery 1.3.1, it slows way down. It parses about a > > quarter of the table, and then the browser throws a timeout error. If > > I select continue, it will parse about half it did before, and through > > another timeout error, click continue, parses about half of that, time > > out, and on and on. I will have to hit the continue button at least 12 > > times to parse the whole table. > > > I have done some testing to see if I can fix the problem. If I comment > > out the two hide statements and the addclass/hover statement so the > > code is not manipulating the tabel, it speeds way up. It is only when > > I uncomment one statement, and it does not matter which one or the > > number, that it slows way down. > > > I would like to move up to 1.3.1, but it is not usable to me in its > > current state. If anybody can help me with fixing this, or if future > > versions of jQuery can be fixed (if jQuery is at blame at all), it > > would be much appreciated. > > > Thanks!
