Diferència entre revisions de la pàgina «Solució exercici espera»

De wikiserver
Dreceres ràpides: navegació, cerca
 
(4 revisions intermèdies per un altre usuari que no es mostra)
Línia 9: Línia 9:
  
 
             function inici() {
 
             function inici() {
                 if (window.ActiveXObject) { //Iexplorer
+
                 if (window.XMLHttpRequest) { //Tots els altres navegadors que soporten ajax
                    xhr = new ActiveXObject("Microsoft.XMLHTTP");
 
                }
 
                else if (window.XMLHttpRequest) { //Tots els altres navegadors que soporten ajax
 
 
                     xhr = new XMLHttpRequest();
 
                     xhr = new XMLHttpRequest();
 
                 }
 
                 }
Línia 19: Línia 16:
 
                 }
 
                 }
  
                 xhr.open('GET', 'info.php', true);
+
                 xhr.open('GET', 'espera.php', true);
  
 
                 xhr.onreadystatechange = function () {
 
                 xhr.onreadystatechange = function () {
Línia 74: Línia 71:
 
</source>
 
</source>
  
 +
fitxer espera.php
 
<source lang="php">
 
<source lang="php">
 
<?php
 
<?php
Línia 84: Línia 82:
 
echo date('h:i:s');
 
echo date('h:i:s');
 
?>
 
?>
 +
</source>
 +
 +
el mateix amb fitxer espera.jsp
 +
<source lang="jsp">
 +
<%
 +
Thread.sleep(1000);
 +
out.print("Ahora la espera es menos molesta.");
 +
%>
 
</source>
 
</source>

Revisió de 16:39, 3 abr 2024

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" >
            var xhr;

            function inici() {
                if (window.XMLHttpRequest) { //Tots els altres navegadors que soporten ajax
                    xhr = new XMLHttpRequest();
                }
                else {
                    throw new Error("Ajax is not supported by this browser");
                }

                xhr.open('GET', 'espera.php', true);

                xhr.onreadystatechange = function () {
                  
                        if (this.status >= 200 && this.status < 300) {
                            switch (xhr.readyState) { //Según el estado de la petición devolvemos un Texto.
                                case 0:
                                    document.getElementById('1').innerHTML = "Sin iniciar";
                                    break;
                                case 1:
                                    document.getElementById('2').innerHTML = "Cargando";
                                    break;
                                case 2:
                                    document.getElementById('3').innerHTML = "Cargado";
                                    break;
                                case 3:
                                    document.getElementById('4').innerHTML = "Interactivo";
                                    break;
                                case 4:
                                    document.getElementById('5').innerHTML = "Completado";
                                    //Si ya hemos completado la petición, devolvemos además la información. 
                                    document.getElementById('resultado').innerHTML = xhr.responseText;
                                    break;
                            }
                        }
                    
                }
                

                xhr.send(null);


            }

            window.onload = inici;

        </script>
    </head>
    <body>

        <table border="4"> 
            <tr> 
                <td><span id="1">Estado petición</span></td> <!--Campo para indicar el estado de la petición--> 
                <td><span id="2">Estado petición</span></td> 
                <td><span id="3">Estado petición</span></td> 
                <td><span id="4">Estado petición</span></td> 
                <td><span id="5">Estado petición</span></td> 
                <td><span id="resultado">Sin resultado</span></td>  
            </tr>  
        </table> 
        
    </body>
</html>

fitxer espera.php

<?php
echo date('h:i:s') . "<br>";

//sleep for 5 seconds
sleep(4);

//start again
echo date('h:i:s');
?>

el mateix amb fitxer espera.jsp

<% 
Thread.sleep(1000); 
out.print("Ahora la espera es menos molesta."); 
%>