Как вы останавливаете браузер от "песочных часов", когда Javascript завершен (остановить throbber)?

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

  •  06-09-2020
  •  | 
  •  

Вопрос

Написав небольшую HTML-веб-страницу с очень простым Javascript в ней, я заметил, что после того, как это было сделано, круг продолжал вращаться (firefox).Я видел это много раз на других страницах и всегда думал, что это ошибка Javascript или проблема с циклом, но эта программа, которую я запускал, определенно была выполнена.

Вот один из примеров небольшой веб-страницы, которая делает это.После того, как вы нажмете на кнопку и она обработается, пульсатор (спасибо Kooilinc за этот термин) продолжит работу.

<!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>

Я смог остановить это, нажав стоп (щелкните правой кнопкой мыши и остановите).

Что мне нужно сделать, чтобы заставить Javascript прекратить обработку (или браузер прекратить обработку) после завершения скрипта?

Примечание1:Это произошло в FF4.01, а не в IE или Chrome (для этого примера кода).

Примечание 2:Я попробовал функцию window.stop() после инструкции switch, и это не остановило пульсатор.

Согласно ответу Лекенштейна, document.close() после инструкции switch решил эту проблему, но вот пример, который вообще не работал и не использует 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>
Это было полезно?

Решение

После звонка document.write(), вы должны позвонить document.close() если документ ранее не был закрыт.

По сути, это происходит:

  1. Страница обрабатывается
  2. Скрипты обрабатываются
  3. Страница "закрыта" (document.close())

Если document.write() вызывается на шаге 2, он будет завершен на шаге 3.После шага 3, если вы позвоните document.write, вы снова открываете страницу, но страница не закрывается сама по себе в FF (не уверен насчет других).Вы должны закрыть его, позвонив по телефону document.close().

Я обнаружил это, когда мне нужно было открыть окно и быстро ввести в него данные в FF.

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

То же самое относится и к вашему делу:

<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>
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top