Heim > Artikel > Web-Frontend > So verwenden Sie Jquery_jquery in einer MVC-Anwendung
Vorwort: Im Handumdrehen ist es bereits Mitte November, und ab heute werde ich die detaillierte Verwendung von ASP.NET MVC weiter studieren, also werde ich diese Lesenotizen und persönlichen Erfahrungen in eins schreiben Blog, damit jeder etwas lernen kann. Das Buch, das ich gelesen habe, ist: ASP.NET MVC Advanced Programming. Im Folgenden werde ich über die Verwendung von JavaScript und Jquery in MVC sprechen. Es gibt auch Ajax, das wir mittlerweile oft verwenden.
1. Vorläufige Einführung in Ajax
(1) Fast alle von uns erstellten Webanwendungen verwenden mittlerweile Ajax-Technologie. Technisch gesehen steht Ajax für Asynchronous JavaScript and XML (Ajax). In der Praxis stellt es alle Techniken dar, die zum Erstellen reaktionsfähiger Webanwendungen mit einer guten Benutzererfahrung verwendet werden.
(2) ASP.NET MVC4 ist ein modernes Web-Framework und unterstützt wie andere moderne Web-Frameworks von Anfang an die Ajax-Technologie. Der Kern der Ajax-Unterstützung stammt aus der Open-Source-JavaScript-Bibliothek Jquery.
(3) Wenn wir Ajax in MVC verwenden möchten, müssen wir lernen, dass Jquery nicht der Schwerpunkt dieses Blogs ist. Wenn Sie es also noch nicht gelernt haben, empfehle ich Ihnen, mit derselben anfänglichen Studie zu beginnen Mein Jquery-Lernen kommt von „Sharp Jquery“.
2. So verwenden Sie Jquery in einer MVC-Anwendung
(1) Wenn Sie die Visual Studio-Projektvorlage zum Erstellen eines neuen ASP.NET MVC-Projekts verwenden, werden standardmäßig alle für die Verwendung von Jquery erforderlichen Inhalte generiert. Jedes neue Projekt enthält einen Skriptordner mit vielen .js-Dateien. Sie können ein neues MVC-Projekt erstellen, um einen Blick darauf zu werfen, wie im Bild gezeigt:
(2) Die JQuery-Kernbibliothek ist eine Datei mit dem Namen Jquery-
(2) Das Verhalten und die Funktionen einer komprimierten JavaScript-Skriptdatei auf dem Client sind die gleichen wie die einer nicht komprimierten Datei. Da die komprimierte Datei jedoch kleiner ist, ist es normalerweise möglich, die komprimierte Datei an zu senden der Client so weit wie möglich (weil es die Anzahl der heruntergeladenen Datenbytes reduzieren und dadurch das Laden und Ausführen beschleunigen kann).
(3) Die Standardlayoutansicht (_Layout.cshtml) in ASP.NET MVC-Anwendungen verwendet normalerweise das folgende Skript-Tag, um auf die vereinfachte Version von Jquery zu verweisen:
Hinweis: Wenn Sie Jquery in MVC verwenden möchten, müssen Sie das obige Skript-Tag über die Layout-Ansicht im HTML-Tag platzieren.
3. Platzieren Sie das Skript im Knoten
(1) Eine andere Möglichkeit, Skripte in die Ausgabe einzufügen, besteht darin, einen Razor-Abschnitt zu definieren, um Skripte zu verhindern. Beispiel: In der Layoutansicht (_Layout.cshtml) können Sie einen Knoten mit dem Namen „Skripte“ rendern und ihn als optional festlegen . Der Code lautet wie folgt:
@RenderSection("scripts", erforderlich: false);
(2) Jetzt können wir in jeder Ansicht ein Skript hinzufügen, das auf das Layout verweist, um ein bestimmtes Skript in den Kopf der Ansicht einzufügen: Index.cshtml
@{
ViewBag.Title = "Homepage";
}
@Abschnittsskripte{
}
(3) Zu diesem Zeitpunkt drücken wir F5, um die Website auszuführen und die Website-Homepage zu öffnen: http://localhost:34147/home/index. Wir können sehen, dass jquery.validate. Die von uns hinzugefügte js-Datei wird am Ende des JS-Zitats angezeigt. Wie im Bild gezeigt:
(4) Die oben vorgestellte Methode kann die genaue Position des Skript-Tags festlegen, um sicherzustellen, dass die erforderlichen Skripte in der richtigen Reihenfolge angezeigt werden.
4.Andere Dateien im Skriptverzeichnis
(1) Lassen Sie uns besprechen, dass das System beim Erstellen einer MVC-Anwendung standardmäßig einen Ordner „Skripte“ für uns hinzugefügt hat, der viele JavaScript-Dateien enthält. Wofür werden diese Dateien verwendet? Lassen Sie uns separat darüber sprechen
(2) Zusätzlich zur JQuery-Kernbibliothek enthält das Skriptverzeichnis auch zwei JQuery-Plug-Ins: JQuery UI und JQuery-Validierung. Diese Erweiterungen erweitern die Funktionen der JQuery-Kernbibliothek.
(3) Einige Leute haben möglicherweise auch entdeckt, dass es in Skripts Dateien gibt, die „vsdoc“ enthalten. Diese Dateien sind speziell dafür konzipiert, Visual Studio bei der Bereitstellung besserer intelligenter Erkennungsfunktionsdienste zu unterstützen. Es besteht keine Notwendigkeit, direkt darauf zu verweisen Wenn Sie diese Dateien im Programm speichern, müssen Sie sie nicht an den Client senden. Visual Studio erkennt diese Dateien automatisch, wenn benutzerdefinierte Skriptdateien verwendet werden, auf die im Skript verwiesen wird.
(4) Die Dateien im Verzeichnis, deren Namen das Wort „unobtrusive“ enthalten, wurden von Microsoft geschrieben. Diese nicht aufdringlichen Skripte integrieren die Jquery- und ASP.NET MVC-Frameworks und stellen so die oben genannten nicht aufdringlichen JavaScript-Funktionen bereit . Wenn Sie die Ajax-Funktionen des ASP.NET MVC-Frameworks implementieren möchten, müssen Sie diese Dateien verwenden.
(5) Das Verzeichnis enthält auch einige Dateien, deren Namen mit dem Wort Microsoft beginnen (wie MicrosoftAjax.js), die entweder die Microsoft Ajax-Bibliothek enthalten oder auf der Microsoft Ajax-Bibliothek aufbauen, als ASP.NET MVC3-Anwendungen Die Standardabhängigkeit besteht in Jquery, daher benötigen Programme, die unter dem ASP.NET MVC3-Framework erstellt wurden, diese Dateien nicht, sodass sie sicher aus der Anwendung entfernt werden können. Der Grund, warum diese Dateien hier enthalten sind, liegt hauptsächlich in der Abwärtskompatibilität.
Okay, lassen Sie uns heute hier aufhören. Im Detail weiß jeder bereits, wie man jQuery in MVC verwendet. Lassen Sie uns das später ausführlich besprechen