Cómo usar Jquery_jquery en una aplicación MVC
Prefacio: En un abrir y cerrar de ojos, ya estamos a mediados de noviembre y, a partir de hoy, continuaré estudiando el uso detallado de ASP.NET MVC, así que escribiré estas notas de lectura y Experiencias personales en un blog, para que todos también puedan. Si puedo aprender algo, el libro que leí es: Programación avanzada ASP.NET MVC. Ahora hablaré sobre cómo usar JavaScript y Jquery en MVC. También está Ajax, que usamos a menudo ahora.
1. Introducción preliminar a Ajax
(1) Casi todas las aplicaciones web que creamos ahora utilizan la tecnología Ajax. Técnicamente hablando, Ajax significa JavaScript y XML asincrónicos (JavaScript y XML asincrónicos). , Ayax). En términos prácticos, representa todas las técnicas utilizadas en la creación de aplicaciones web responsivas con una buena experiencia de usuario.
(2) ASP.NET MVC4 es un marco web moderno y, al igual que otros marcos web modernos, admite la tecnología Ajax desde el principio. El núcleo del soporte de Ajax proviene de la biblioteca JavaScript de código abierto Jquery.
(3) Si queremos usar Ajax en MVC, tenemos que aprender Jquery. Jquery no es el enfoque principal de este blog, así que si no lo has aprendido antes, te sugiero que comiences por ello. aprendiendo lo mismo, mi Jquery Learning proviene de "Sharp Jquery".
2. Cómo usar Jquery en aplicaciones MVC
(1) Al usar la plantilla de proyecto de Visual Studio para crear un nuevo proyecto ASP.NET MVC, generará de forma predeterminada los requisitos. para usar Jquery Todo el contenido, cada nuevo proyecto contiene una carpeta Scripts con muchos archivos .js. Puede crear un nuevo proyecto mvc para echar un vistazo, como se muestra en la figura:
(2) El. La biblioteca principal de JQuery es un archivo llamado Jquery-.js. Como estoy usando VS 2012, la versión de Jquery es 1.7.1. Este archivo contiene una versión anotada del código fuente de JQuery. También hay un archivo Jquery-.min.js. Los archivos JavaScript minificados contienen ".min" en sus nombres. Como su nombre indica, ocupan menos espacio que sus homólogos no minificados (normalmente la mitad). No contienen espacios en blanco innecesarios, ni comentarios, y todos los nombres de las variables locales tienen un carácter. Si abre un archivo minificado, verá un montón de código JavaScript ilegible. Como se muestra en la figura:
(2) El comportamiento y las funciones del archivo de script JavaScript condensado en el cliente son los mismos que los del archivo no condensado. Sin embargo, dado que el archivo condensado es más pequeño, suele ser lo más pequeño posible. Envíe un archivo condensado al cliente (porque reduce la cantidad de bytes de datos descargados, por lo que se carga y ejecuta más rápido).
(3) La vista de diseño predeterminada (_Layout.cshtml) en las aplicaciones ASP.NET MVC generalmente usa la siguiente etiqueta de script para hacer referencia a la versión simplificada de Jquery:
Inyección en la salida Otra La forma de crear secuencias de comandos es definir una sección de Razor que proteja contra secuencias de comandos. Por ejemplo, en la vista de diseño (_Layout.cshtml), puede representar un nodo llamado Scripts y hacerlo opcional.
El código es el siguiente:
@ViewBag.Title
@RenderSection("scripts", obligatorio: false);
(2) Ahora podemos hacer referencia el diseño Agregue un script a cualquier vista para insertar un script específico en el encabezado de la vista: Index.cshtml
@{
ViewBag.Title = "Home";
}
@section scripts{
}
(3) En este momento presionamos F5 para ejecutar el sitio web y abrir la página de inicio del sitio web: http:// localhost: 34147/home/index, podemos ver que el archivo jquery.validate.js que agregamos se muestra en la parte inferior del JS al que se hace referencia. Como se muestra en la figura:
(4) El método descrito anteriormente puede establecer la posición exacta de la etiqueta del script para garantizar que los scripts requeridos aparezcan en el orden apropiado.
4. Otros archivos en el directorio Scripts
(1) Analicemos que cuando creamos una aplicación MVC, el sistema nos ha agregado una carpeta Scripts de forma predeterminada. Hay muchos archivos JavaScript en él, entonces, ¿para qué sirven estos archivos? Hablemos de ellos por separado
(2) Además de la biblioteca principal de Jquery, el directorio Scripts también contiene dos complementos de Jquery: Jquery UI y Jquery Validation. Estas extensiones aumentan las capacidades de la biblioteca principal de Jquery. .
(3) Es posible que algunas personas también hayan descubierto que hay archivos que contienen "vsdoc" en sus nombres en Scripts. Estos archivos están diseñados específicamente para ayudar a Visual Studio a proporcionar mejores servicios de funciones de detección inteligente. incluidos en el programa. No es necesario hacer referencia a estos archivos directamente y no es necesario enviarlos al cliente. Visual Studio los descubre automáticamente cuando se utiliza un script de referencia en un archivo de script personalizado.
(4) Los archivos en el directorio que contienen la palabra "discreto" en sus nombres están escritos por Microsoft. Estos scripts no intrusivos integran los marcos Jquery y ASP.NET MVC, proporcionando así el carácter discreto mencionado anteriormente. scripts. Funciones intrusivas de JavaScript Si desea implementar las funciones Ajax del marco ASP.NET MVC, debe utilizar estos archivos.
(5) El directorio también contiene algunos archivos cuyos nombres comienzan con la palabra Microsoft (como MicrosoftAjax.js), que contienen la biblioteca Microsoft Ajax o están construidos sobre la biblioteca Microsoft Ajax, porque ASP Las aplicaciones .NET MVC3 dependen de Jquery de forma predeterminada, por lo que los programas creados bajo el marco ASP.NET MVC3 no necesitan estos archivos, por lo que pueden eliminarse de forma segura de la aplicación. La razón por la que estos archivos se incluyen aquí es principalmente para implementar Posterior. compatible.
Bien, detengámonos aquí hoy. Ya sabes cómo usar jQuery en MVC. Analicemos esto en profundidad más adelante.