A veces necesita obtener el tamaño de la imagen, que debe cargarse después de cargar la imagen. A continuación, el editor ha compilado un resumen de varios métodos para juzgar si se carga una imagen JS. Echemos un vistazo.
1. Evento de carga
<script type = "text/javaScript"> $ ('img'). onload = function () {// code} </script>Ventajas: simple y fácil de usar, sin afectar el código HTML.
Desventajas: solo se puede especificar un elemento y el código Javascipt debe colocarse debajo del elemento de imagen
2. Método jQuery
<script type = "text/javaScript"> $ (function () {$ ('. pic1'). Cada (function () {$ (this) .load (function () {$ (this) .fadeIn ();});});}) </script>Tenga en cuenta que no une el evento de carga en $ (documento) .ready ().
Ventajas: los eventos de elementos se pueden unir en lotes y no afectan el contenido del código HTML
Desventajas: se requiere el soporte de la biblioteca jQuery y el código debe colocarse debajo del elemento que debe operarse.
3. Evento ReadyStateChange
<! Doctype html> <html> <fead> <meta charset = "utf -"> <title> img - ReadyStateChange Event </title> </head> <body> <img id = "img" src = "http://pic.win.com/wallpaper/f/cbbaea.jpg"> <p id = "pa" type = "text/javaScript"> img.onreadyStateChange = function () {if (img.readyState == "Complete" || img.readyState == "Cargado") {P.innerhtml = 'ReadyStateChange: Carged'}} </script> </body> </html>ReadyState está completo y cargado, lo que significa que la imagen ha sido cargada. Probar que IE6-II10 admite este evento, pero otros navegadores no.
4. El atributo completo de IMG
< id = "P1"> Carga ... </p> <script type = "text/javascript"> function imgLoad (img, callback) {var timer = setInterval (function () {if (img.complete) {callback (img) clearInterval (timer)}}, 50)} imgload (img1, function () {p1.innerhtml ('loaded')}) </script> </body> </html>La encuesta monitorea continuamente el atributo completo de IMG. Si es cierto, significa que la imagen ha sido cargada y se detiene la encuesta. Esta propiedad es compatible con todos los navegadores.
El contenido anterior es un resumen del método JS para determinar si la imagen está cargada por el editor. Espero que sea útil para todos. Al mismo tiempo, me gustaría agradecerle mucho por su apoyo al sitio web de Wulin Network.