JQuery Document.ready-Funktion blinkt beim Starten der Seite

Question

Ich benutze JQuery's document.ready, um einige Dinge von meiner MVC-Masterseite auszublenden. Wenn die Seite geladen wird, kann ich die Elemente, die ich entferne, für eine Sekunde sehen, bevor sie verschwinden. Diese

ist, wie ich es so mache:

<asp:Content ID="MainContent" ContentPlaceHolderID="MainContent" runat="server"> 
    <script type="text/javascript"> 
     $(document).ready(function() 
     { 
      $("#HideDiv").remove() 
     }); 
    </script> 

Wie kann ich dieses Blinken loswerden? Ich möchte, dass die Elemente, die ich entferne, verschwunden sind, bevor die Seite gerendert wird.

Update:

Ich möchte darauf hinweisen, dass ich diese dynamisch mache, bestimmte Dinge auf bestimmten Seiten versteckt. HideDiv war nur ein Beispiel für einen Namen, vielleicht einen schlechten.

Zum Beispiel habe ich oben eine Menüleiste mit Links zu verschiedenen Seiten. Ich möchte den Link zu einer Seite entfernen, wenn sich der Benutzer auf dieser Seite befindet. Anstatt nur die gewünschten Links auf jeder Seite manuell hinzuzufügen, habe ich alle auf der Masterseite und verstecke nur die, die ich nicht auf der Seite anzeigen möchte.

Anscheinend document.ready ist nicht die Zeit, dies zu tun? Was könnte ein besserer Weg sein, das zu erreichen?

Answer 1

anstelle von entfernen verwenden Sie fadeOut() oder hide();

$("#HideDiv").remove(); // remove completly removes from dom 

die unter denen gibt glatte Wirkung

$("#HideDiv").fadeOut(); 

$("#HideDiv").hide() 

Answer 2

Wenn Sie die Elemente initally mit CSS verstecken werden sie nicht angezeigt werden:

<style type="text/css"> 
#HideDiv { display: none; } 
</style> 

Wenn das nicht möglich ist, können Sie setzen ein Skript-Tag unmittelbar nach dem Element:

<div id="HdeDiv">...</div> 
<script type="text/javascript"> 
$('#HideDiv').remove(); 
</script> 

Answer 3

Ihr JavaScript wird nicht ausgeführt, bis die Seite geladen wurde - das ist es, was $ (document) .ready() tut.

Aber warum nicht das Div mit CSS verstecken? Gefällt mir:

<style type="text/css"> 
    #HideDiv 
    { 
     display: none; 
    } 
</style>