Pesquisar na Comunidade

Encontrei ontem no Google um tutorial de como fazer a barra progressiva no PHP nesse endereço: https://shareurcodes.com/blog/real time progress bar in php#:~:text=A progress bar can be,PHP code and some javascript O problema do código dele é que é necessário anexar a biblioteca do Ajax, coisa que ele não fez no código. Precisei estudar um pouco mais de JS para saber como fazer o mesmo código sem usar o código do Ajax. O código original era assim: <script > $("#button1").click(function(){ document.getElementById('loadarea').src = 'progressbar.php'; }); $("#button2").click(function(){ document.getElementById('loadarea').src = ''; }); </script> e eu arranquei esses dois, bem como os dois botôes que haviam por lá, e simplifiquei tudo num só botão: <input type=submit value=Iniciar onclick=loadarea.src='astudy2.php'> e o código final ficou assim: astudy.php ------------------------------------------- <input type=submit value=Iniciar onclick=loadarea.src='astudy2.php'> <div id="progressbar" style="border:1px solid #ccc; border-radius: 5px; "></div> <br> <div id="information" ></div> <iframe id="loadarea" style="display:none;"></iframe><br /> astudy2.php ----------------------------------------- <?php // crédito desse algoritmo: https://shareurcodes.com/blog/real%20time%20progress%20bar%20in%20php#:~:text=A%20progress%20bar%20can%20be,PHP%20code%20and%20some%20javascript. $mysqli=new mysqli("localhost","root","","diario"); $query=$mysqli->query("select * from tbpessoa"); $i=0; $total=16728 // quantidade atual de registros em tbpessoa while ($row=$query->fetch_assoc()){ $i++; $percent=intval($i/$total*100)."%"; echo '<script> parent.document.getElementById("progressbar").innerHTML="<div style=\"width:'.$percent.';background:linear-gradient(to bottom, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); ;height:35px;\">&nbsp;</div>"; parent.document.getElementById("information").innerHTML="<div style=\"text-align:center; font-weight:bold\">'.$percent.' is processed.</div>";</script>'; ob_flush(); flush(); } echo '<script>parent.document.getElementById("information").innerHTML="<div style=\"text-align:center; font-weight:bold\">Process completed</div>"</script>'; Aqui usei o meu próprio banco de dados, ao invés de simular um atraso artificial que o código original fez.