Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.11.2012, 19:51
Интересующийся
Отправить личное сообщение для JavaScriptProgrammer Посмотреть профиль Найти все сообщения от JavaScriptProgrammer
 
Регистрация: 13.10.2012
Сообщений: 22

Как таймер заставить работать поочерёдно вызываю одну и ту же функцию два раза?
Имеется написанная пользовательская функция с параметрами. Вызывается два раза в коде. Вызванные функции работают почему-то одновременно. А должны по-очереди.
Как заставить таймер работать по-очереди. Как таймер убрать из памяти.

<html>
<title></title>
<head>
<span id="span1"></span>
<br></br>
<span id="span2"></span>
</head>
<body>
<script src="script.js"></script>
<script>
printContent("span1", str1);
printContent("span2", str2);
//document.getElementById("span1").style.width = document.body.clientWidth;
</script>
</body>
</html>


var str1 = "Text1";
var str2 = "Text2";
 
function printContent(id, string){
         
        var element = document.getElementById(id);       
        var counter = 0;
        var interval = window.setInterval(
                                              
        function(){     
          element.innerHTML += string[counter++];
      
          if(counter == string.length){
                window.clearInterval(interval);
          }     
          
        },  
        50 
                           );       
}
Ответить с цитированием
  #2 (permalink)  
Старый 08.11.2012, 20:14
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

всё правильно, таймеры в js работают именно так.

первое и самое простое что приходит в голову.
var str1 = "Text1";
var str2 = "Text2";
 
function printContent(id, string, callback){
        var element = document.getElementById(id);       
        var counter = 0;
        var interval = window.setInterval(  function(){     
          element.innerHTML += string[counter++];
      
          if(counter == string.length){
                window.clearInterval(interval);
                if (typeof callback!='undefined') callback();
          }     
          
        },  50 );       
}


printContent("span1", str1,function(){
     printContent("span2", str2);
});
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 08.11.2012 в 20:18.
Ответить с цитированием
  #3 (permalink)  
Старый 08.11.2012, 20:23
Интересующийся
Отправить личное сообщение для JavaScriptProgrammer Посмотреть профиль Найти все сообщения от JavaScriptProgrammer
 
Регистрация: 13.10.2012
Сообщений: 22

Объясните код пожалуйста.
В странице предполагается большое количество span-объектов, хотелось бы вызывать пользовательскую функцию с одним параметрам(id, string) без callback.
И каждый раз поочерёдно.
Ответить с цитированием
  #4 (permalink)  
Старый 08.11.2012, 20:38
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

function teletayper(){
      var teleStack=[];       
      function add (id,str){
          teleStack.push({id:id, str:str })
      };
      
      function play (){
              var param=teleStack.shift();
              if (typeof param!='indefined') printContent(param.id,param.str);
      }
      
     
      function printContent(id, string){
            var element = document.getElementById(id);       
            var counter = 0;
            var interval = window.setInterval(  function(){     
                  element.innerHTML += string[counter++];
      
                  if(counter == string.length){
                       window.clearInterval(interval);
                       play ();
                 }     
          
            },  50 );       
       }

        return {
             add:add,
             play:play
        };

}


var t=teletayper();
  t.add('bla', 'bla bla');
  t.add('bla2', 'bla bla2');
  t.add('bla', 'bla bla');
  t.play();


Допили код если я что то гдето забыл, заодно поупражняешся
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 08.11.2012 в 21:02.
Ответить с цитированием
  #5 (permalink)  
Старый 08.11.2012, 20:55
Интересующийся
Отправить личное сообщение для JavaScriptProgrammer Посмотреть профиль Найти все сообщения от JavaScriptProgrammer
 
Регистрация: 13.10.2012
Сообщений: 22

не работает код.
Ответить с цитированием
  #6 (permalink)  
Старый 08.11.2012, 20:56
Интересующийся
Отправить личное сообщение для JavaScriptProgrammer Посмотреть профиль Найти все сообщения от JavaScriptProgrammer
 
Регистрация: 13.10.2012
Сообщений: 22

плиз сделайте правильный код.
Ответить с цитированием
  #7 (permalink)  
Старый 08.11.2012, 21:03
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

вместо
if (typeof param!='indefined') printContent(param.id,param);
нужно
if (typeof param!='indefined') printContent(param.id,param.str);
опечатка.



<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>
    <div id="x"></div>
    <div id="y"></div>
    
    <script>
      function teletayper(){
            var teleStack=[];       
            function add (id,str){
                teleStack.push({id:id, str:str })
            };
            
            function play (){
                    var param=teleStack.shift();
                    if (typeof param!='indefined') printContent(param.id,param.str);
            }
            
           
            function printContent(id, string){
                  var element = document.getElementById(id);       
                  var counter = 0;
                  var interval = window.setInterval(  function(){     
                        element.innerHTML += string[counter++];
            
                        if(counter == string.length){
                             window.clearInterval(interval);
                             play ();
                       }     
                
                  },  50 );       
             }
      
              return {
                   add:add,
                   play:play
              };
      
      }
      
      t=teletayper();
      t.add('x','hello');
      t.add('y','hello 2222222');
      t.play();
    </script>

  </body>
</html>
__________________
Лучше калымить в гандурасе чем гандурасить на колыме
Ответить с цитированием
  #8 (permalink)  
Старый 08.11.2012, 21:13
Интересующийся
Отправить личное сообщение для JavaScriptProgrammer Посмотреть профиль Найти все сообщения от JavaScriptProgrammer
 
Регистрация: 13.10.2012
Сообщений: 22

код работает только с 2 div. с div больше 2 он не работает.
как исправить код.
Ответить с цитированием
  #9 (permalink)  
Старый 08.11.2012, 21:16
Интересующийся
Отправить личное сообщение для JavaScriptProgrammer Посмотреть профиль Найти все сообщения от JavaScriptProgrammer
 
Регистрация: 13.10.2012
Сообщений: 22

нет работает. а как объяснить код. как можно всё это написать проще. без ооп. как было раньше одно значение хранилась в памяти, потом другое и т.д.
Ответить с цитированием
  #10 (permalink)  
Старый 08.11.2012, 21:23
х.з
Посмотреть профиль Найти все сообщения от dmitriymar
 
Регистрация: 21.11.2010
Сообщений: 4,588

от я чего то не догоняю. появляются в один день несколько новых ников -предположительно человек и давай темы свои повторно дублировать.
даже после полученных правильных ответов .
ты надеешься, что чудным образом заранее нерабочие алгоритмы твои заработают после дублей?
причём колбеки если таймеры не гарантируют порядок выполнения? избавляйся от таймеров последовательно вызывающихся

Последний раз редактировалось dmitriymar, 08.11.2012 в 21:27.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как заставить пустой тег <p> быть высотой в одну строку? xintrea (X)HTML/CSS 6 01.10.2012 09:38
Как на два события назначить одну функцию shaltay jQuery 2 28.02.2011 15:50
Как два раза вставить таймер alexvost Общие вопросы Javascript 2 08.02.2011 02:28
как заставить jQuery работать с переменными gooody jQuery 1 19.02.2010 13:10
Как заставить работать оперу и мозилу? SDone AJAX и COMET 6 25.02.2009 16:05