Comment utiliser Jquery_jquery dans une application MVC

Préface : En un clin d'œil, nous sommes déjà à la mi-novembre, et à partir d'aujourd'hui, je continuerai à étudier l'utilisation détaillée d'ASP.NET MVC, j'écrirai donc ces notes de lecture et expériences personnelles dans un blog pour que tout le monde puisse apprendre quelque chose, le livre que j'ai lu est : ASP.NET MVC Advanced Programming, ci-dessous je parlerai de la façon d'utiliser JavaScript et Jquery dans MVC. Il y a aussi Ajax, que nous utilisons souvent maintenant.

1.Introduction préliminaire à Ajax

　(1) Presque toutes les applications Web que nous créons utilisent désormais la technologie Ajax. Techniquement parlant, Ajax signifie Asynchronous JavaScript and XML (Ajax). Concrètement, il représente toutes les techniques utilisées pour créer des applications Web réactives avec une bonne expérience utilisateur.

　(2) ASP.NET MVC4 est un framework Web moderne et, comme d'autres frameworks Web modernes, il prend en charge la technologie Ajax depuis le début. Le cœur du support Ajax provient de la bibliothèque JavaScript open source Jquery.

　(3) Si nous voulons utiliser Ajax dans MVC, nous devons apprendre Jquery n'est pas l'objectif principal de ce blog, donc si vous ne l'avez pas appris auparavant, je vous suggère de commencer par la même étude initiale. . Mon apprentissage Jquery vient de " Sharp Jquery ".

2. Comment utiliser Jquery dans une application MVC

　(1) Lorsque vous utilisez le modèle de projet Visual Studio pour créer un nouveau projet ASP.NET MVC, il générera tout le contenu nécessaire pour utiliser Jquery par défaut. Chaque nouveau projet contiendra un dossier Scripts avec de nombreux fichiers .js, vous pouvez créer un nouveau projet mvc pour y jeter un œil, comme indiqué sur l'image :

　

　(2) La bibliothèque principale de JQuery est un fichier nommé Jquery-.js Parce que j'utilise VS 2012, la version de Jquery est 1.7.1. Ce fichier contient la version annotée de JQuery. Il existe également un fichier Jquery-.min.js. Les fichiers JavaScript condensés contiennent ".min" dans leur nom, ils occupent moins d'espace que les fichiers non condensés correspondants (généralement la moitié plus petite). Ils ne contiennent aucun espace inutile, aucun commentaire et tous les noms de variables locales comportent un caractère. Si vous ouvrez un fichier minifié, vous verrez un tas de code JavaScript illisible. Comme le montre l'image :

　　

　(2) Le comportement et les fonctions d'un fichier de script JavaScript condensé sur le client sont les mêmes que ceux d'un fichier non condensé. Cependant, comme le fichier condensé est plus petit, il est généralement possible d'envoyer le fichier condensé vers. le client autant que possible (car il peut réduire le nombre d'octets de données téléchargés, accélérant ainsi le chargement et l'exécution).

(3) La vue de mise en page par défaut (_Layout.cshtml) dans les applications ASP.NET MVC utilise généralement la balise de script suivante pour référencer la version simplifiée de Jquery :

　

Remarque : si vous souhaitez utiliser Jquery dans MVC, vous devez placer la balise de script ci-dessus dans la balise HTML via la vue mise en page.

3. Placez le script dans le nœud

　(1) Une autre façon d'injecter des scripts dans la sortie consiste à définir une section Razor pour empêcher les scripts. Par exemple : dans la vue de mise en page (_Layout.cshtml), vous pouvez afficher un nœud nommé Scripts et l'ajouter comme facultatif. . Le code est le suivant :

　

　

　

　

@RenderSection("scripts", obligatoire : false);

　

(2) Nous pouvons maintenant ajouter un script dans n'importe quelle vue qui fait référence à la mise en page pour injecter un script spécifique dans l'en-tête de la vue : Index.cshtml

　@{

　　ViewBag.Title = "Page d'accueil";

　}

　@section scripts{

　

　}

　(3) À ce moment-là, nous appuyons sur F5 pour exécuter le site Web et ouvrir la page d'accueil du site : http://localhost:34147/home/index Nous pouvons voir que jquery.validate. js que nous avons ajouté est affiché. Il se trouve au bas du devis JS. Comme le montre l'image :

　

　(4) La méthode introduite ci-dessus peut définir la position exacte de la balise de script pour garantir que les scripts requis apparaissent dans l'ordre approprié.

4. Autres fichiers dans le répertoire Scripts

　(1) Discutons du fait que lorsque nous créons une application MVC, le système a ajouté par défaut un dossier Scripts, qui contient de nombreux fichiers JavaScript. Alors, à quoi servent ces fichiers ? Parlons-en séparément

　(2) En plus de la bibliothèque principale Jquery, le répertoire Scripts contient également deux plug-ins Jquery : Jquery UI et Jquery validation. Ces extensions augmentent les capacités de la bibliothèque principale Jquery.

(3) Certaines personnes ont peut-être également découvert qu'il existe des fichiers contenant "vsdoc" dans leurs noms dans les scripts. Ces fichiers sont spécifiquement conçus pour aider Visual Studio à fournir de meilleurs services de fonction de détection intelligente. Il n'est pas nécessaire de faire référence directement. ces fichiers dans les fichiers du programme, il n'est pas nécessaire de les envoyer au client, Visual Studio découvrira automatiquement ces fichiers lors de l'utilisation de fichiers de script personnalisés référencés dans le script.

(4) Les fichiers du répertoire contenant le mot « discret » dans leurs noms sont écrits par Microsoft. Ces scripts non intrusifs intègrent les frameworks Jquery et ASP.NET MVC, fournissant ainsi les fonctionnalités JavaScript non intrusives mentionnées ci-dessus. , si vous souhaitez implémenter les fonctionnalités Ajax du framework ASP.NET MVC, vous devez utiliser ces fichiers.

　(5) Le répertoire contient également des fichiers dont les noms commencent par le mot Microsoft (comme MicrosoftAjax.js), qui contiennent soit la bibliothèque Microsoft Ajax, soit sont construits au-dessus de la bibliothèque Microsoft Ajax, comme les applications ASP.NET MVC3. La dépendance par défaut est sur Jquery, donc les programmes créés sous le framework ASP.NET MVC3 n'ont pas besoin de ces fichiers, ils peuvent donc être supprimés en toute sécurité de l'application. La raison pour laquelle ces fichiers sont inclus ici est principalement pour des raisons de compatibilité ascendante.

D'accord, arrêtons-nous ici aujourd'hui. Vous savez déjà comment utiliser jQuery dans MVC. Discutons-en en profondeur plus tard