2012-05-27 17 views
25

Tengo un sitio con dos columnas. Quiero tener la misma altura en ambos usando jQuery.window.onload contra document.ready jQuery

Estoy tratando de obtener la altura de la columna del logotipo. Tenía:

$(document).ready(function() { 
    alert($('#logo').height()); 
});​ 

y no funcionó. Así que lo cambié a:

window.onload = function(){ 
    alert($('#logo').height()); 
} 

Y está funcionando. ¿Qué está pasando aquí?

Respuesta

34

document ready se dispara cuando el DOM se ha cargado, por lo que la información como la altura no está disponible, a menos que se declare explícitamente.

window onload espera a que los activos en la página se carguen por completo, por lo que la información como la altura ya está disponible.

+0

oh gracias por la respuesta: P una allí una manera de conseguir la altura, pero sin necesidad de W8 de imágenes para cargar? – KryQ

+0

Si las dimensiones de ancho/alto se especifican en la etiqueta '', puede obtenerlas antes de que se carguen. De lo contrario, vas a tener que esperar. – ahren

2

que tenían un mismo problema en el manejo de la altura y la anchura interior $ (document) listo y he encontrado algunas referenses mejor para resolverlo ... Espero que esto pueda ayudar a alguien

$ (document). ready()

El evento listo para el documento se activa cuando se carga el documento HTML y el DOM está listo, incluso si todos los gráficos no se han cargado aún. Si desea conectar sus eventos para ciertos elementos antes de que se cargue la ventana, entonces $ (document) .ready es el lugar correcto.

Código:

$(document).ready(function() { 
    // document is loaded and DOM is ready 
    alert("document is ready"); 
}); 

$ .load (ventana)()

El evento de carga ventana disparó un poco más tarde, cuando la página completa se ha cargado completamente, incluyendo todos los marcos, objetos e imágenes. Por lo tanto, las funciones que conciernen a imágenes u otros contenidos de la página deben colocarse en el evento de carga para la ventana o la etiqueta de contenido en sí.

Código:

$(window).load(function() { 
    // page is fully loaded, including all frames, objects and images 
    alert("window is loaded"); 
}); 
Cuestiones relacionadas