Jquery-Funktion von $ (Dokument) aufgerufen .ready dauert zu lange - IE Popup "stop running script" -Dialog

Ich habe das folgende Skript zu "FreezePane" -Funktionalität in HTML nachahmen, wie in Excel, wo die rechte Seite und die Header werden beide gescrollt, wenn der Benutzer die Ergebnistabelle scrollt.

fnAdjustTable=function(){ 

    var colCount=$('#firstTr>td').length; //get total number of column 

    var m=0; 
    var n=0; 
    var brow='mozilla'; 
    jQuery.each(jQuery.browser, function(i, val) { 
     if(val==true){ 

      brow=i.toString(); 
     } 
    }); 
    $('.tableHeader').each(function(i){ 
     if(m<colCount){ 

      if(brow=='mozilla'){ 
       $('#firstTd').css("width",$('.tableFirstCol').innerWidth());//for adjusting first td 

       $(this).css('width',$('#table_div td:eq('+m+')').innerWidth());//for assigning width to table Header div 
      } 
      else if(brow=='msie'){ 
       $('#firstTd').css("width",$('.tableFirstCol').width()); 

       $(this).css('width',$('#table_div td:eq('+m+')').width());//In IE there is difference of 2 px 
      } 
     } 
     m++; 
    }); 

    $('.tableFirstCol').each(function(i){ 
     if(brow=='mozilla'){ 
      $(this).css('height',$('#table_div td:eq('+colCount*n+')').outerHeight()-1);//for providing height using scrollable table column height 
     }else if(brow=='msie'){ 

      $(this).css('height',$('#table_div td:eq('+colCount*n+')').innerHeight()); 
     }else{ 
      $(this).css('height',$('#table_div td:eq('+colCount*n+')').height()); 
     } 
     n++; 
    }); 



} 

fnScroll=function(){ 

    $('#divHeader').scrollLeft($('#table_div').scrollLeft()); 
    $('#firstcol').scrollTop($('#table_div').scrollTop()); 
}

Das Problem ist, dass, wenn durch die „tableFirstCol“ tds iteriert, der Fehler das Skript zu stoppen läuft erscheint. Gibt es einen effizienteren Weg dies zu tun?

Im Wesentlichen ändert das Skript die Größe der oberen Kopf- und Seitenbereiche so, dass sie der Breite in der ersten Zeile/Spalte entsprechen. Wenn ich meinen Bericht mit einem großen Datumsbereich (Seitenkopf) ausführe, wird das Skript normalerweise angezeigt, wenn mehr als 30 Seitenkopfzeilen vorhanden sind.

Jede Hilfe wird geschätzt!

Quelle

2010-12-29 AAFR

Verwenden IE8 Profiler, um herauszufinden, was so lange dauert. Meine Vermutung ist, dass es die Rückflüsse sind, die durch die Größenänderung der Header verursacht werden.Wenn dies der Fall ist, müssen Sie die Größenänderung außerhalb des Dokuments vornehmen. klonen Sie den Tabellenknoten und ersetzen Sie ihn oder verwenden Sie die HTML-Zeichenfolge. – Hemlock

@Hemlock, oder einfach ['detach()'] (http://api.jquery.com/detach/) verwenden und dann 'add()' zurückgeben. –

David, wenn ich am Anfang der Methode eine Trennung mache, und dann füge ich "hinzufügen" oder "anhängen" hinzu, um es zu seinem eigenen div hinzuzufügen? Ich habe diese versucht und die Größenänderung/etc tritt nicht auf. Ich versuche herauszufinden, was hier vor sich geht. – AAFR

Sie benötigen Selektoren zwischenzuspeichern:

var tableDiv = $('#table_div'), 
    divHeader = $('#divHeader'), 
    firstcol = $('#firstcol'), 
    tableFirstCol = $('.tableFirstCol'), 
    tds = $('td', tableDiv);

Sie können .EQ für Ihre Spalte Selektoren (n).

Verwenden Sie nicht $(this).css("height", n), wenn this.style.height = n; ist einfacher und schneller. Diese

$('.tableHeader').each(function(i){ 
    if(m<colCount){ 
     /* ... */ 
    } 
    m++; 
});

sollte sein:

$('.tableHeader').each(function(i){ 
    if(i<colCount){ 
     /* ... */ 
    } 
});

und ich bin mir nicht ganz sicher, Sie würden auch brauchen die i<colCount Prüfung (aber ich muss die HTML sehen).

Das Browser-Sniffing ist wahrscheinlich nicht notwendig. Versuchen Sie, ein Reset-Stylesheet und eine gültige doctype oder verwenden Sie HTML5Boilerplate.

Wenn Sie Browser sniff HABEN: Sie könnten nur verwenden:

if($.browser.mozilla){ 
    /* ... */ 
} 
else if ($.browser.msie){ 
    /* ... */ 
} 
else{ 
    /* ... */ 
}

Sie könnten auch diesen Code unten ziemlich viel kondensieren. Schau dir die DRY principle an.

Auch, wie zum Einstellen der Höhe der tableFirstCol, konnten Sie nicht einfach nur die Höhe der Reihe einstellen?

Quelle

2010-12-29 16:11:18

Danke, das hat geholfen, aber das Problem ist, wenn ich eine Trennung mache, dann werden die Breiten alle als 0 zurückgegeben, also wird nichts erreicht. Wenn ich das Trennen nicht mache, läuft das Skript zu lange. – AAFR

Wie viele Spalten hast du? –

Sie könnten den HTML-Code mit id Tags für jede Spalte und Zeile generieren. Wählen Sie dann einfach den Namen anstelle der komplizierten Selektoren.

Ich würde sagen, dass $('#table_div td:eq('+colCount*n+')') ist ein komplizierter Selektor, während $('#row1') ist viel einfacher.

Auch - ich glaube, was Sie für einen Browser-Check tun, wird nicht funktionieren. Der Code, den Sie durchlaufen haben, durchläuft alle Eigenschaften für den erkannten Browser und setzt den Wert brow auf den letzten Wert. Verwenden Sie anstelle der Schleife, die Sie haben, etwas wie $.browser.webkit, um nach Webkit zu suchen, und $.browser.msie, um nach IE zu suchen. Wie Ihr Code jetzt ist, denke ich, dass Sie immer den else Fall ausführen werden. Sehen Sie hier für mehr auf dem jQuery-Browser-Objekt: http://api.jquery.com/jQuery.browser/

Quelle

2010-12-29 15:53:28 zsalzbank

Beachten Sie auch, dass das Browser-Sniffing schlecht ist. :-) –

Jquery-Funktion von $ (Dokument) aufgerufen .ready dauert zu lange - IE Popup "stop running script" -Dialog

Antwort

Verwandte Themen