Richtige Methode zur Verwendung von JQuery bei der Verwendung von MasterPages in ASP.NET?

Ich habe keine Probleme bei der Verwendung von JQuery in einer Aspx-Seite ohne eine Masterpage, aber wenn ich versuche, es in Seiten mit einer Masterpage zu verwenden, funktioniert es nicht, also setze ich die Jquery-Dateien und andere Skriptdateien auf der Seite anstelle des Masters. Wenn ich jetzt 10 Seiten habe, mache ich das für alle 10, von denen ich weiß, dass sie falsch sind. In der Beispielmaspepage unten, wo würde ich meine Skriptdateien ablegen.Richtige Methode zur Verwendung von JQuery bei der Verwendung von MasterPages in ASP.NET?

<html> 
<head runat="server"> 
    <asp:ContentPlaceHolder ID="head" runat="server"> 
    </asp:ContentPlaceHolder> 
</head> 
<body> 
    <asp:ContentPlaceHolder ID="ContentPanel" runat="server"> 
    </asp:ContentPlaceHolder>    
</body> 
</html>

Ich habe vor kurzem die fancybox Plugin und was ich tat, war stattdessen in der Masterpage die jquery Skript und fancybox Skripte setzen, weil ich auf dem Erhalten sie frustriert bekam, zu arbeiten, ich es einfach in die Seite gestellt, wo ich wollte das Skript ausgeführt werden, insbesondere am unteren Rand, kurz vor dem Abschluss asp: Inhalt. Natürlich habe ich jetzt das Problem, wenn ich das fancybox-Plugin auf anderen Seiten verwenden möchte, würde ich das jquery-Skript und das fancybox-Skript auf allen 5 Seiten anstatt nur auf der Hauptseite einfügen. Wenn es um Masterseiten geht, wo geht dann alles nach meinem obigen Beispiel?

Quelle

2009-04-08 Xaisoft

Sie würden Ihre Haupt jQuery-Skripte innerhalb der Master-Seite erklären, wie man es normalerweise:

<head runat="server"> 
    <link href="/Content/Interlude.css" rel="Stylesheet" type="text/css" /> 
    <script type="text/javascript" src="/Scripts/jquery-1.3.2.min.js"></script> 
    <asp:ContentPlaceHolder ID="head" runat="server"> 
    </asp:ContentPlaceHolder> 
</head>

Und dann konnte keine Seite spezifischen JS-Dateien innerhalb der Content-Steuerelemente, die den Leiter Content Referenz geladen werden.

Eine bessere Option wäre jedoch, in die ScriptManager und ScriptManagerProxy Kontrollen zu schauen - diese können Ihnen viel mehr Kontrolle über die Art und Weise, wie Ihre JS-Dateien an den Client geliefert werden.

So würden Sie eine Scriptmanager-Steuerelement platzieren Sie Seite beherrschen, und einen Verweis auf die in der jQuery Core Code hinzu:

<body> 
    <form id="form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
     <Scripts> 
     <asp:ScriptReference Path="/Scripts/jquery-1.3.2.min.js" /> 
     </Scripts> 
    </asp:ScriptManager>

auf Ihrer Seite also, dass einige benutzerdefinierte JS-Dateien erfordert, oder ein jQuery Plugin können Sie haben:

<asp:Content ID="bodyContent" ContentPlaceholderID="body"> 
    <asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="server"> 
     <Scripts> 
     <asp:ScriptReference Path="/Scripts/jquery.fancybox-1.2.1.pack.js" /> 
     </Scripts> 
    </asp:ScriptManagerProxy>

Das Script Sie Dinge wie Kontrolle erlaubt, zu tun, wo auf der Seite Skripte gerendert werden mit LoadScriptsBeforeUI (oder besser noch, nachdem sie durch es auf false festlegen).

Quelle

2009-04-08 19:44:22

Verwenden Sie einen anderen contentplaceholder für Ihr Skript. Es wäre an der Unterseite des Masterpage, in der Nähe des </body> Tag

<script type="text/javascript" src="myscript.js" /> 
<asp:ContentPlaceHolder ID="ScriptContent" runat="server"> 

</asp:ContentPlaceHolder>

Platz Diesen Tag wie diese aussieht. Dadurch können Sie Skripte auf der Masterpage und auch auf Ihren Seiten hinzufügen. Stellen Sie sicher, dass Ihre Skripts in der richtigen Reihenfolge geladen werden, indem Sie die Seitenquelle anzeigen und sicherstellen, dass der HTML-Code richtig gerendert wird. Viel Glück.

Oh noch eine Sache, stellen Sie sicher, jQuery und dann FancyBox laden vor allen anderen js Sie haben da draußen oder sonst wird es nicht funktionieren. Javascript lädt in der Reihenfolge, in der es aufgerufen wurde, jQuery muss zuerst geladen werden!

Quelle

2009-04-08 19:19:10

Wird JavaScript vor HTML-Markup geladen? – Xaisoft

Ich verwende diese Methode.

<script type="text/javascript" language="javascript" src='<%=ResolveUrl("~/scripts/jquery.js") %>' ></script>

Legen Sie es einfach über Ihr Tag ...

<asp:ContentPlaceHolder ID="head" runat="server"> 
    </asp:ContentPlaceHolder>

Quelle

2010-02-11 01:40:25 Kieran

+1, aber ich habe eine Warnung erhalten, wenn das Sprachattribut mit dem ungültigen Attribut –

Ich bevorzuge dies, da es nicht ScriptManager oder zusätzliche Komponente benötigt. –

Dies ist, was in einer Master-Seite arbeiten:

Für Datei Script:

<script type="text/javascript" src="<%= ResolveUrl("~/script/scriptFile.min.js") %>"></script>

Für CSS-Datei:

<link rel="stylesheet" href="~/styles/CssFile.min.css" runat="server" />

Weitere Nicht es:

Verwenden Sie die verkleinerte Versionen könnten wie möglich (FileName.min.js) und (FileName.min.css) Ladezeit zu reduzieren und SEO verbessern.
Setzen Sie die CSS vor der </head> und das Skript vor der </body> zu verbessern Leistung und SEO zu verbessern.
Das Kachelzeichen (~) im Pfad wird automatisch zum Stamm Ihrer Website aufgelöst.
Vergessen Sie nicht, runat="server" nur für das Stylesheet zu verwenden. Das Skript darf nicht über runat="server" verfügen, da es bereits die Serveroperatoren <%= %> verwendet.
Sie können die http://jscompress.com/ online verwenden, um Ihr Javascript zu komprimieren und https://csscompressor.net/, um Ihre CSS-Dateien zu komprimieren.

Quelle

2015-05-12 01:12:52

Richtige Methode zur Verwendung von JQuery bei der Verwendung von MasterPages in ASP.NET?

Antwort

Verwandte Themen