Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Рекурсия в setInterval (https://javascript.ru/forum/events/35184-rekursiya-v-setinterval.html)

platedz 02.02.2013 23:58

Рекурсия в setInterval
 
Нужно последовательно выполнить одну функцию с разными параметрами

Код примерно такой

function setint(elem)
{
var seti1 = setInterval(function()
		{ 
			elem.style.left = (parseInt(elem.style.left)+10)+"px";
			if(parseInt(elem.style.left) > 100) 
				{
				
					clearInterval(seti1);
				
				}
			
		},100); 

}
setint(document.getElemetnById("id_1"));

Соответственно, после того, как setint выполнилось с id_1, нужно его выполнить c id_2, затем с id_3, а потом опять с id_1 и так по кругу. Подскажите, пожалуйста, как это можно сделать?

Deff 03.02.2013 00:15

(function(){ 
var i=0;
var seti1 = setInterval(function(){ 
 var elem=document.getElemetnById("id_"+i%3+'1')
			elem.style.left = (parseInt(elem.style.left)+10)+"px";
			if(parseInt(elem.style.left) > 100&&i==2) clearInterval(seti1);
i++;	
		},33); 

}())

рони 03.02.2013 00:25

Цитата:

Сообщение от platedz
потом опять с id_1 и так по кругу

и куда двигаться если было if(parseInt(elem.style.left) > 100)
<!DOCTYPE HTML>
<html>
<head>
  <title></title>
<style type="text/css">
div{
  height: 100px;
  width: 100px;
  background-color: #FFCC00;
}
</style>
</head>
<body>
<div id="id_1" style="left: 5px; position: relative">id="id_1"</div>
<div id="id_2" style="left: 5px; position: relative">id="id_2"</div>
<div id="id_3" style="left: 5px; position: relative">id="id_3"</div>
<script language="JavaScript" type="text/javascript">
function setint(num)
{
var elem = document.getElementById("id_"+num)
var seti1 = setInterval(function()
		{
			elem.style.left = (parseInt(elem.style.left)+10)+"px";
			if(parseInt(elem.style.left) > 100)
				{

					clearInterval(seti1);

                  if(num++ < 4)  setint(num)

				}

		},100);

}
setint(1);
</script>
</body>
</html>

platedz 03.02.2013 00:55

Всю функцию я писать не стал. Т.к. там очень много параметров. Т.е. я создаю несколько div, затем добавляю текс, устанавливаю начало смещения, и тд. Затем удаляю и так нужно сделать по циклу.

Спасибо Deff за вариант, но учитывая, что параметров много, такой способ не очень удобен. Может есть способ выполнить через рекурсию, те. как-то так


function setint(elem)
{
var seti1 = setInterval(function()
		{ 
			elem.style.left = (parseInt(elem.style.left)+10)+"px";
			if(parseInt(elem.style.left) > 100) 
				{
				
					clearInterval(seti1);
				setint(document.getElemetnById("id_2"));
				}
			
		},100); 

}

но по циклу. Причем основная проблема - это начать сначала, те. с id_1

platedz 03.02.2013 02:06

Спасибо, в целом Вышло.

Буду теперь пробовать передать параметры через объект.

Deff 03.02.2013 02:08

platedz,
Нет смысла вызывать setInterval для установки каждого параметра, что не айс(тем паче если параметров много)
Когда можно установки делать с единственного setInterval, и даже его не прерывать, clearInterval(seti1); а лишь ставить stop Keу для вызова внутренних, вложенных функций для каждого параметра(или группы)

platedz 03.02.2013 02:34

Подскажите, пожалуйста, а как бы мне теперь вместо

var elem = document.getElementById("id_"+num)

передать объект

var elem = object_num


Т.е. у меня получается

var object_1 = {a: "a1",b:"b1"}
var object_2 = {a: "a2",b:"b2"}
var object_3 = {a: "a3",b:"b3"}

рони 03.02.2013 11:42

platedz,
Вариант ...
var num = 2
var object_1 = {a: "a1",b:"b1"}
var object_2 = {a: "a2",b:"b2"}
var object_3 = {a: "a3",b:"b3"}
var obj = ['',object_1,object_2,object_3]
alert(obj[num]['a']);

platedz 03.02.2013 14:06

Deff, рони Большое спасибо. Все вышло.


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