Tengo el siguiente código, que funciona perfectamente para actualizar automáticamente la página. Sin embargo, durante la carga inicial de la página, pasan 40 segundos antes de que el contenido obtenido aparezca en la página. ¿Cómo puedo hacer que el contenido aparezca inmediatamente durante la carga inicial y luego se actualice después de 40 segundos?
$(document).ready(function(){ jQuery(window).on("load", function(){ refreshInterval = setInterval(function(){ $('#box').load('handle.php'); },40000); }); });Solución
$(document).ready(function(){ jQuery(window).on("load", function(){ $('#box').load('handle.php'); refreshInterval = setInterval(function(){ $('#box').load('handle.php'); },40000); }); })Aquí está el código exacto que necesita.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <h1>Stack overflow answer</h1> <div id="box"></div> <script> $(document).ready(function() { const userAlreadyVisited = localStorage.getItem('visited'); // After the first load it will load the content from handle.php after 2 second every time if (userAlreadyVisited) { jQuery(window).on("load", function() { setTimeout(() => { $('#box').load('handle.php'); }, 5000); }); } else { // The content of handle.php will be loaded immediately after the page load localStorage.setItem('visited', true); jQuery(window).on("load", function() { $('#box').load('handle.php'); }); } }) </script> </body> </html>Aquí está el contenido del archivo handle.php
<?php echo '<h3>Data from handle.php</h3>';