Форум

Nifler · #1 (**permalink**) 14.05.2015, 13:18

День добрый
написал я вот такой код, он занимается тем, что выпихивает построчно текст из-за рамки так чтобы его было видно. Код работает и текст летает. вот сам код.

var nth=1;
				var i=1;
				function leftText(){
					$('ul.slides>li:nth-child('+nth+')>article>div>ul>li:nth-child('+i+')').animate({
						'margin-left':'500px'
					},'slow');					
					if(i==12){
					  clearInterval(timerId);					  			
					}
				}
				var timerId = setInterval(function(){leftText(); i++}, 300);

по сути он находит список и поочередно совает его элементы. но вот в чем вопрос: верно ли я закончил выполнение setInterval? так как, когда я поставил после clearInterval alert, то он мне нескончаемое количество сообщений вывел. можно ли заканчивать циклическое выполнение функции внутри функции которую вызывает эта функция?

ksa · #2 (**permalink**) 14.05.2015, 15:38

Сообщение от Nifler

можно ли заканчивать циклическое выполнение функции внутри функции которую вызывает эта функция?

Бивас, тест! (с)

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
<link rel="stylesheet/less" type="text/css" href="style.less">
<script src="http://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.0/less.min.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
	var i=1;
	function test(){
		$('#info').text(i);					
		if(i==12){
		  clearInterval(timerId);					  			
		}
	}
	var timerId = setInterval(function(){test(); i++}, 300);
});
</script>
</head>
<body>
<div id="info"></div>
</body>
</html>

Таки можно!

Aetae · #3 (**permalink**) 14.05.2015, 15:46

Возможно проверочный алерт был засунут не туда куда нужно.)

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
<link rel="stylesheet/less" type="text/css" href="style.less">
<script src="http://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.0/less.min.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function(){
    var i=1;
    function test(){
        $('#info').text(i);                
        if(i==12){
          alert('конец'); 
          clearInterval(timerId);                              
        }
    }
    var timerId = setInterval(function(){test(); i++}, 300);
});
</script>
</head>
<body>
<div id="info"></div>
</body>
</html>

Nifler · #4 (**permalink**) 14.05.2015, 15:57

разобрался, я проверял изменение DOM вечной циклической функцией, которая постоянно повторяла запуск всех этих моих функций. и она клепала запуски алерта. теперь пытаюсь понять как работает MutationObserver...

Aetae · #5 (**permalink**) 14.05.2015, 16:26

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

//Хотя всё равно обидно, что от MutatonEvents полностью отказались, для юзерскриптов часто полезная фича была, а теперь приходится расширения писать в некоторых случаях.

Nifler · #6 (**permalink**) 16.05.2015, 04:29

Сообщение от Aetae

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

//Хотя всё равно обидно, что от MutatonEvents полностью отказались, для юзерскриптов часто полезная фича была, а теперь приходится расширения писать в некоторых случаях.

для меня js это магия, большая великая магия. я ничего не понимаю как оно работает и почему оно работает, и нет времени нормально взяться выучить. эти функции в функциях просто выносят мозг и как работает обсервер теоретически я прочел, и понимаю то, что тут написано, но на практике реализовать не смог. если есть желание офигеть с кода, то вот:

(function($,andefined){	
	$(document).ready(function(){
		$("#mitka").css("margin-left","0");
		function newSlide(){
			for (var i=1; i<10; i++){
				var margin=$("#mitka").css("margin-left");
				if($(".slides>li:nth-child("+i+")").css("display")=="list-item"){
					if(i+"px"!=margin){
						$("#mitka").css("margin-left",i);
						$('.slides>li:nth-child('+i+')>article>div>ul>li').css("margin-left","-500px");		
						var nth=i;
						var j=1;
						function leftText(){
							$('ul.slides>li:nth-child('+nth+')>article>div>ul>li:nth-child('+j+')').animate({
								'margin-left':'0px'
							},'slow');					
							if(j==12){
							  //clearInterval(timerId);	
							}
						}		
						
						timerId = setInterval(function(){leftText(); j++}, 200)			
					
						$(".li_slyde").removeClass("li_slyde");
						var nextI=i+1;
						$(".uk-navbar-nav>li:nth-child("+nextI+")").addClass("li_slyde");
					}			
				}else{
				}				
			}
		}			
		setInterval(newSlide, 200);		
	})
})(jQuery)

это код, который высовывает текст на слайде, когда слайд листается. http://poli.molodost-dolgoletie.com/ вот тут он работает.
могу сказать что #mitka создан исключительно для того, чтобы запоминать в каком слайде мы находимся, так как я так и не смог это запомнить в переменной. остальное сделано при помощи такого же бреда.

Форум

Справочник

Discord чат

Курсы javascript