Ereignisse vor $(document).ready

Question

Ich habe eine Funktionalität, um Steuerelemente bedingt vor dem Laden des Dokuments auszublenden. Wenn ich diese Funktionalität auf $(document).ready setze, sehe ich das Seitenflimmern, um die Steuerelemente bedingt auszublenden. Ich würde gerne wissen, ob es ein Ereignis gibt, das aufgerufen werden kann, bevor $(document).ready ausgelöst wird.

Answer 1

Gängiges Problem. Verwenden Sie CSS, um die Steuerelemente standardmäßig auszublenden, und verwenden Sie dann JS beim $(document).ready, um zu entscheiden, welche Steuerelemente sichtbar gemacht werden sollen. Es wird kein Flimmern geben. Es wird einfach so aussehen, als würden die entsprechenden Teile der Seite progressiv geladen werden.

Sie können JS nicht sicher ausführen, bevor das Dokument bereit ist, und Teile des Dokuments werden sichtbar sein, bevor Sie JS ausführen können. Die einzige Lösung besteht darin, sicherzustellen, dass alle nicht-flimmernden Elemente standardmäßig ausgeblendet sind, und dann nur diejenigen anzuzeigen, die sichtbar sein sollen.

Der einfachste Weg, dies zu tun, besteht darin, allen dynamischen Elementen einfach eine gemeinsame Klasse hinzuzufügen:

und CSS zu verwenden, um sicherzustellen, dass sie alle standardmäßig ausgeblendet sind:

.initiallyHidden {display: none;}

Und dann überschreibt Ihr JavaScript dies, wenn es entscheidet, dass ein Element sichtbar sein soll:

document.getElementById("myControl1").style.display = "block";

Answer 2

Wie von anderen erwähnt, mach etwas Ähnliches wie dies

 mein verstecktes div-Tag 

.hidden
{
 display:none;   
}

im document.ready, kannst du zeigen, dies entspricht dem onload, das darauf wartet, dass das HTML geladen wird

$(document).ready(function() {
  $('#test').show();
});

jsfiddle Beispiel hier

http://jsfiddle.net/kdpAr/

Answer 3

Wenn ich etwas verstecken musste, bevor Javascript geladen wird, würde ich es im CSS wie folgt verstecken:

 display:none;

oder:

 visibility: hidden;

Sie können auch Bedingungen in Kombination mit Javascript verwenden, um es bei Bedarf anzuzeigen.

Answer 4

Rufen Sie die JavaScript-Funktion neben dem HTML-Element auf

beispiel:

call JS Funktion

Answer 5

Sie können einfach ein Skript-Tag direkt nach dem HTML öffnen, das Sie bedingungsweise ausblenden möchten (jQuery muss jedoch zuvor deklariert werden) und dann direkt ausblenden aufrufen, nicht innerhalb eines $(document).ready wie folgt:

Lorem ipsum

  $("#toHide").hide();