Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Использование метода setTimeout (https://javascript.ru/forum/misc/1801-ispolzovanie-metoda-settimeout.html)

News 18.09.2008 15:13

Использование метода setTimeout
 
Здравствуйте!
Написал скрипт, который переводит число из десятичной системы в двоичную и выводит весь процесс по шагам. Мне нужно сделать так, чтобы каждый шаг процесса выводился с небольшой временной задержкой, чтобы было нагляднее. В цикл, где выводятся шаги алгоритма, пишу setTimeout (document.write(numb),5). В результате выводится самое первое число, с которого начинается весь процесс перевода, но после него уже не выводится ничего. Наверное, я что-то не так понял в правилах употребления этого метода. Подскажите, пожалуйста, как сделать правильно?
На всякий случай, приведу сам скрипт.
Код:

<SCRIPT LANGUAGE="javascript">
    var numb = prompt ("Введите число в десятичной системе счисления","Здесь");
    cyfr=new Array()
    document.write("<HTML>")
    document.write("<TITLE>Перевод числа</TITLE>")
    document.write("<font size='+1'>")
    document.write("<center><H2>Перевести число "+numb+" из десятичной системы счисления в двоичную </H2></center><br>")
    var i=0 //номер итерации
    while (numb>1) //пока число можно делить на 2
  {
    i=i+1
    var a = Math.floor(numb/2);
    document.write("<font color='#0000CC'><b>")
    document.write(numb)              //здесь показано
    document.write("</font></b>") //что-то вроде деления
    document.write(" |_ 2<br>")    //в столбик
    if (a<=1)
  {
    document.write(a*2+" | ")  //a - это целая часть от деления
    document.write("<font color='#CC0000'><b>")
    document.write(a+"<br>")
    document.write("</font></b>")
  }
   
  else
  {
  document.write(a*2+" | ")
  document.write("<font color='#0000CC'><b>")
  document.write(a+"<br>")
  document.write("</font></b>")
  }
  document.write("<hr size='1' align='left' width='45' color='000000'>")
  document.write("<font color='#CC0000'><b>")
  document.write(numb-(a*2)) //вычитаем из исходного числа а и получаем остаток от деления
  cyfr[i]=numb-(a*2) //все получаемые остатки на каждом шаге деления заносим в массив
  document.write("</font></b>")
  numb=a
  //здесь мы закончили рисовать очередной столбик и переходим к следующему шагу процесса. Вот примерно в этом месте и хотелось бы поставить задержку.
 }
   
 document.write("&nbsp&nbsp&nbsp&nbsp&nbsp <b> Ответ: </b>")
  for (k=i;k>=1;k=k-1)
  {
  document.write(cyfr[k])
  }
  document.write("</HTML>")
 
</SCRIPT>


ZoNT 18.09.2008 17:28

тебе надо цикл "while (numb>1)" заменить на функцию. В функции проверять
numb>1, если выполняется условие, то выполнять то что было в теле цикла + ещё раз вызывать по таймауту эту же функцию.

News 18.09.2008 20:29

Сделал функцию, как вы и говорили. Теперь вообще как-то странно работает: выполняется одна итерация, а затем концовка скрипта. А через время задержки страница обновляется, пропадает фоновый рисунок и настройки шрифта меняются на стандартные.

<BODY background="images.files/клетка4.bmp">
  <SCRIPT LANGUAGE="javascript">
   
   function Count(numb)
  {
   if (numb>1)
  { var a = Math.floor(numb/2);
    i=i+1
    for (k=1;k<=5;k=k+1)
   {
    document.write("&nbsp")
   }
   
   document.write("<font color='#0000CC'><b>") 
   document.write(numb)
   document.write("</font></b>")
   document.write(" |_ 2<br>")

   for (k=1;k<=5;k=k+1)
   {
    document.write("&nbsp")
   }

   if (a<=1)
  {
   document.write(a*2+" | ")
   document.write("<font color='#CC0000'><b>")
   document.write(a+"<br>")
   document.write("</font></b>")
  }
    
   else
  {
   document.write(a*2+" | ")
   document.write("<font color='#0000CC'><b>")
   document.write(a+"<br>")
   document.write("</font></b>")
  }
    
   document.write("<hr size='1' align='left' width='45' color='000000'>")
   document.write("<font color='#CC0000'><b>")
   
   for (k=1;k<=5;k=k+1)
   {
    document.write("&nbsp")
   }

   document.write(numb-(a*2))
   document.write("&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <img src='images.files/стрелка.bmp'>")
   
   if (a<=1)
  {
   if (a==0) 
   {    
    document.write("&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <img src='images.files/ноль.bmp'>")
   }
   else
   {
    document.write("&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <img src='images.files/один.bmp'>")
   }
   
   if ((numb-(a*2))==1)
   {
    document.write("<img src='images.files/один.bmp'><br><br>")
   }
    
   else   
   {
    document.write("<img src='images.files/ноль.bmp'><br><br>")
   }

   cyfr[i]=numb-(a*2)
   i=i+1  
   cyfr[i]=a
  }

  else
  {
   if ((numb-(a*2))==1)
   {
   document.write("&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <img src='images.files/один.bmp'><br><br>")
   }
  
   else   
   {
   document.write("&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <img src='images.files/ноль.bmp'><br><br>")
   }

   cyfr[i]=numb-(a*2)
  }
   document.write("</font></b>")
   numb=a
   setTimeout("Count(numb)",3000)
  }
 else
  {
   setTimeout("function(End())",3000)
  }
 }
   var numb = prompt ("Введите число в десятичной системе счисления","Здесь");    
   cyfr=new Array()
   document.write("<HTML>")
   document.write("<TITLE>Перевод числа</TITLE>")
   document.write("<font size='+1'>")
   document.write("<center><H2>Перевести число "+numb+" из десятичной системы счисления в двоичную </H2></center><br>")
   var i=0
   Count(numb)
   document.write("&nbsp&nbsp&nbsp&nbsp&nbsp Переписываем полученные значения в обратном порядке. <br>") 
   document.write("&nbsp&nbsp&nbsp&nbsp&nbsp <b> Ответ: </b>")
   for (k=i;k>=1;k=k-1)
   {
    document.write(cyfr[k])
   }
   document.write("</HTML>")
</SCRIPT>
</BODY>
</HTML>


Где косяк?

ZoNT 18.09.2008 20:37

всё верно. Так как ты используешь document.write, то получаешь по заслугам! document.write перезаписывает документ (стирает исходный), если он закрыт на запись.

Использовать document.write плохо.
Используй document.body.innerHTML.
Только не надо писать:
document.body.innerHTML += ...
document.body.innerHTML += ...
document.body.innerHTML += ...
document.body.innerHTML += ...

Заведи переменную (строку). В неё всё сложи и потом одним махом допиши к document.body.innerHTML.


Часовой пояс GMT +3, время: 00:39.