Lo siento si esto se ha respondido antes, pero todas las búsquedas hablan de las diferencias, no de usar los dos juntos, si es posible.
Simplemente, ¿se puede $(window).load.(function() {}) DENTRO de $(document).ready.(function() {}) ?
Tengo algunas cosas que deben hacerse después de cargar el DOM, pero luego quiero revelar ciertos elementos solo después de que las imágenes hayan terminado de cargarse. Lo único que funciona en Explorer 8 es poner las funciones $(window).load dentro del $(document).ready con todo lo demás.
¿Es esta una práctica aceptable?
Solo quiero usar el método más aceptable para revelar un DIV que contiene imágenes pequeñas, como una barra de herramientas, después de que esté completamente construido. ( visibility hidden frente a display none , por ejemplo). El HTML para este DIV está escrito por el código dentro de $(document).ready y luego se agrega al cuerpo usando $('body').append() antes de usar $(window).load .
Tengo muchos problemas con Explorer 8.
Esto funciona bien y es una práctica aceptable. Después de todo, como usted describe, puede haber casos en los que la lógica en el controlador $(window).load() dependa del trabajo que se lleva a cabo después de que el DOM esté listo. Si la ventana ya está cargada en el momento en que configura $(window).load() , el controlador se activará de inmediato.
Me encontré con este problema recientemente... desde jQuery versión 3 , ya no podemos poner $(window).on('load') dentro de document.ready()... porque el controlador listo se llama de forma asíncrona, lo que significa que listo puede ser llamado después de la carga.
Del equipo principal de jQuery : Github: problemas de jQuery 3
Para ser claros, entendemos qué está causando esto. Recientemente hicimos que los controladores listos se dispararan de forma asíncrona. Esto tiene ventajas a las que es difícil renunciar. La desventaja es que el controlador listo a veces puede activarse después del evento de carga si el evento de carga se activa lo suficientemente rápido. El efecto secundario que está viendo en este problema es que está vinculando un controlador de eventos de carga después de que el evento de carga ya se haya activado.
La solución es enlazar la carga fuera de ready.
$(function() { // Things that need to happen when the document is ready }); $(window).on("load", function() { // Things that need to happen after full load });
EDITAR:
NOTA: Esta respuesta solo se aplica a jQuery v2 y versiones anteriores.
Se garantiza que el controlador pasado a
.ready()se ejecutará después de que el DOM esté listo , por lo que este suele ser el mejor lugar para adjuntar todos los demás controladores de eventos y ejecutar otro código jQuery.
método de evento jQuery .load() :
El evento de
loadse envía a un elemento cuando éste y todos los subelementos se han cargado por completo . Este evento se puede enviar a cualquier elemento asociado con una URL: imágenes, scripts, marcos, iframes y el objeto de la ventana.
Según la documentación de jQuery anterior, no he visto nada que indique algún problema con lo siguiente:
$(document).ready(function () { // will fire IMMEDIATELY after the DOM is constructed $(window).load(function() { // will only fire AFTER all pages assets have loaded }) }); Colocar un .load dentro de un ready simplemente garantiza que el DOM esté listo cada vez que se active la load .
Es posible que desee colocar todo el código jQuery dentro de un solo controlador listo para DOM y, sin embargo, aún puede tener un subconjunto de código jQuery que requiere que todas las imágenes se carguen primero. Este arreglo garantiza que todo el código se active una vez que esté listo para DOM y el resto se activará posteriormente cuando los recursos de la página hayan terminado de cargarse.
En última instancia, esto puede ser más una cuestión de preferencia personal, sin embargo, el OP claramente preguntaba si este arreglo causaría problemas. Esto no ha demostrado ser cierto.