tengo la siguiente función:
jQuery(document).ready(function(){ window.addEventListener("load", function (){ alert("hello"); });Funciona en la primera ejecución, pero luego deja de funcionar cuando presiono el botón de actualización.
Si vacío el caché o vuelvo a cargar, funciona de nuevo una vez.
¿Qué está pasando? ¿Cómo puedo arreglar esto?
Intente agregar el controlador fuera de document.ready() de jQuery:
window.addEventListener("load", function (){ ... }); jQuery(document).ready(function(){ ... }; En la primera ejecución, la página puede tardar en cargar recursos externos (como imágenes). Durante ese tiempo se llama a jQuery(document).ready(...) .
Cuando termina de cargar los recursos externos, se dispara el evento de load y la función funciona correctamente.
Curiosamente, al actualizar, los recursos ya están almacenados en caché, por lo que el evento window.load se activa tan rápido y ocurre antes de jQuery(document).ready() , y dado que agrega el controlador de eventos después de que se disparó el evento, el controlador es no llamado Cuando borraste el caché, funcionó de nuevo.
Alternativamente, puede verificar que el documento esté completo primero de la siguiente manera:
function document_loaded(){ // To be called when the document is loaded. ... }; document.readyState == "complete" ? document_loaded() : window.addEventListener("load", document_loaded);Esto funcionará sin importar dónde coloque el código.
Si desea ejecutar un script cada vez que se carga la página, la mejor manera es colocar el código directamente en la función principal:
jQuery(document).ready(function(){ alert("hello"); };De la documentación: https://learn.jquery.com/using-jquery-core/document-ready/ :
El código incluido dentro
$( document ).ready()solo se ejecutará una vez que la página Document Object Model (DOM) esté lista para que se ejecute el código JavaScript.
Si quieres esperar también a que se carguen tus activos debes escribir:
jQuery(window).on("load", function(){ alert("hello"); });