Como você impede o navegador de 'ampulheta' quando o Javascript é CONCLUÍDO (parar de pulsar)?

StackOverflow https://stackoverflow.com/questions/6067976

  •  06-09-2020
  •  | 
  •  

Pergunta

Escrevendo uma pequena página HTML com um Javascript bem simples, percebi que depois de pronto o círculo continuava girando (firefox).Já vi isso muitas vezes em outras páginas e sempre pensei que era um erro de Javascript ou problema de loop, mas esse programa que eu estava executando definitivamente estava pronto.

Aqui está um exemplo de uma pequena página da web que faz isso.Depois de clicar no botão e ele ser processado, o pulsante (obrigado ao Kooilinc pelo termo) continua.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>Grade Tester</title>
    <script language="javascript" type="text/javascript">       
      function calculate()
      {
       var grade = document.getElementById("grade").value.toUpperCase();        
        switch (grade)
        {
         case "A":
           document.write("Outstanding Achievement");
           break;

         case "B":
           document.write("Above Average");
           break;

         case "C":
           document.write("Average Achievement");
           break;

          case "D":
            document.write("Low Passing Grade");
           break;

         case "F":
           document.write("Failing Grade");
            break;
        }
      }
    </script>       
    </head>
  <body>
    Grade:<input type="text" id="grade" />
    <br /><input type="button" value="Get Result" onclick="calculate()" />
  </body>
</html>

Consegui pará-lo clicando em parar (clique com o botão direito e pare).

O que preciso fazer para que o Javascript pare o processamento (ou o navegador pare o processamento) após a conclusão do script?

Nota 1:Isso ocorreu no FF4.01, não no IE ou no Chrome (para este exemplo de código).

Nota 2:Tentei a função window.stop() após a instrução switch e ela não parou de pulsar.

De acordo com a resposta de Lekensteyn, document.close() após a instrução switch resolveu este problema, mas aqui está um exemplo que não pulsou e não usa document.close().

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>Lab 9.1</title>
  </head>
  <body>
    <script language="javascript" type="text/javascript">
      var phrase = "Every good boy does fine goes on the line."
      document.write(phrase.length + "<br />");
      for(var i = 0; i < phrase.length; i++)
      {
        document.write(phrase.charCodeAt(i) + " ");
      }
        document.write("<br />");
        document.write(phrase.toLowerCase() + "<br />");
        document.write(phrase.toUpperCase() + "<br />");
    </script>
  </body>
</html>
Foi útil?

Solução

Depois de ligar document.write(), você deve ligar document.close() se o documento não foi fechado anteriormente.

Basicamente, isso acontece:

  1. A página está sendo analisada
  2. Os scripts são processados
  3. A página está "fechada" (document.close())

Se document.write() é chamado na etapa 2, será concluído na etapa 3.Além da etapa 3, se você ligar document.write, você está abrindo a página novamente, mas a página não fecha sozinha no FF (não tenho certeza sobre outras).Você tem que fechá-lo ligando document.close().

Descobri isso quando precisei abrir uma janela e escrever nela rapidamente no FF.

var win = window.open();
win.document.write("something");
// the next line is required to finish the page
win.document.close();

O mesmo se aplica ao seu caso:

<script type="text/javascript">
function calculate()
{
    var grade = document.getElementById("grade").value.toUpperCase();
    switch (grade)
    {
    case "A":
        document.write("Outstanding Achievement");
        break;
    // removed some cases
    case "F":
        document.write("Failing Grade");
        break;
    }
    // finish the document
    document.close();
}
</script>
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top