Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.06.2013, 16:17
Аватар для Алек
Аспирант
Отправить личное сообщение для Алек Посмотреть профиль Найти все сообщения от Алек
 
Регистрация: 14.04.2013
Сообщений: 85

Последовательность выполнения функций
Здравствуйте!

У меня есть 4 функции, они выполняются одновременно, но мне нужно сделать так чтоб они выполнялись поочерёдно.
Подскажите пожалуйста как это мне сделать, а то я всё время чё-то на этом спотыкаюсь.

Вот функции:

function one_img(){	
	$('#img_1').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
			})
		})		
	});
	}

	function two_img(){	
	$('#img_2').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
			})
		})		
	});
	}	

	function three_img(){	
	$('#img_3').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
			})
		})		
	});
	}	

	function for_img(){	
	$('#img_4').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
			})
		})		
	});
	}	
	
	one_img();
	two_img();
	three_img();
	for_img();


Заранее большое спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 21.06.2013, 17:40
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 307

у меня опыта нет.. но callback разве не для этого?

var callbacks = $.Callbacks();
callbacks.add(one_img );
callbacks.add(two_img );
callbacks.add(three_img );
callbacks.add(for_img );
callbacks.fire();


http://api.jquery.com/jQuery.Callbacks/

Но сам с колбэками не работал, может они тут нафиг и не нужны. )

Последний раз редактировалось Faab, 21.06.2013 в 18:07. Причина: убрал ошибку в коде
Ответить с цитированием
  #3 (permalink)  
Старый 21.06.2013, 18:25
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 307

нее... проверил, так тоже срабатывают все 4 функции одновременно
Ответить с цитированием
  #4 (permalink)  
Старый 21.06.2013, 18:33
Аватар для Алек
Аспирант
Отправить личное сообщение для Алек Посмотреть профиль Найти все сообщения от Алек
 
Регистрация: 14.04.2013
Сообщений: 85

Да, я тоже проверил, всё равно срабатывают все 4 одновременно, сейчас смотрю документацию по кэлбэкам, попробую разобраться, может всё-таки ответ в этой стороне.
Хотя нет, тут должен быть другой способ, посмотрю похожие темы на форуме...

Последний раз редактировалось Алек, 21.06.2013 в 18:40.
Ответить с цитированием
  #5 (permalink)  
Старый 21.06.2013, 18:39
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 307

Слушай, а что за ошибка вылазивает

Метка времени: 21.06.2013 17:36:04
Ошибка: TypeError: $(...).effect is not a function
Источник: test.js
Строка: в твоём коде в посте строка 4, 14, 24, 34

4 ошибки... у тебя этих ошибок нет? Я из-за этой ошибки не могу протестировать ещё один вариант.
Ответить с цитированием
  #6 (permalink)  
Старый 21.06.2013, 18:51
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 307

Если закомментировать то место где у меня вылазивает ошибка (я пока стал вдаваться что за эффект ты навсил и как), то так у меня всё работает:

function one_img(){	
	$('#img_1').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
                                 two_img();
			})
                       
		})		
	});
	}

	function two_img(){	
	$('#img_2').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
                                three_img();
			})
		     
                })		
	});
	}	

	function three_img(){	
	$('#img_3').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
                                 for_img();
			 })
                   })		
	});
	}	

	function for_img(){	
	$('#img_4').fadeOut(2000, function(){
		$(this).attr('width', 100).attr('height', 62).show(1500, function(){
			$(this).effect('pulsate', 1500, function(){
				$(this).attr('width', 199).attr('height', 125);
			})
		})		
	});
	}	
	
	one_img();


Осталось выяснить что я закомментировал и исправить ошибку, но смысл решения проблемы будет тот же думаю.

У меня просто плагин UI наверное не установлен, вот и ошибка вылазивает. Я поправил код, так работает?

Последний раз редактировалось Faab, 21.06.2013 в 18:56.
Ответить с цитированием
  #7 (permalink)  
Старый 21.06.2013, 19:17
Аватар для Алек
Аспирант
Отправить личное сообщение для Алек Посмотреть профиль Найти все сообщения от Алек
 
Регистрация: 14.04.2013
Сообщений: 85

Да, спасибо!
Всё отлично работает.
А так, да если UI не установлено, ошибки вплывают.
У меня она полностью почти установлена, кроме виджетов, я попутно ещё корзину разрабатываю для контента, потипу как в интернет магазине.

Ещё раз спасибо вам за подсказку!
Ответить с цитированием
  #8 (permalink)  
Старый 21.06.2013, 19:47
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 307

Удачи.

Вот у меня вопрос, к спецам JS. Вот какая польза от callback?

Вот пример (пусть в его случае и неверное по смыслу) топстартера:

one_img();
two_img();
three_img();
for_img();


А вот аналог кода на callback:
var callbacks = $.Callbacks();
callbacks.add(one_img );
callbacks.add(two_img );
callbacks.add(three_img );
callbacks.add(for_img );
callbacks.fire();


И в чём фишка callback? Я не вижу приимущество использования callback... В каких ситуациях его используют?
Ответить с цитированием
  #9 (permalink)  
Старый 21.06.2013, 20:48
Аватар для vadim5june
Студент
Отправить личное сообщение для vadim5june Посмотреть профиль Найти все сообщения от vadim5june
 
Регистрация: 30.04.2012
Сообщений: 1,113

удалил

Последний раз редактировалось vadim5june, 21.06.2013 в 20:54.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Последовательность функций как в jquery platedz Events/DOM/Window 54 09.01.2013 03:07
последовательность функций stuff Общие вопросы Javascript 12 01.08.2011 16:31
jquery, последовательность выполнения операция vadim525 jQuery 5 30.07.2011 20:46
Последовательность выполнения функций nematod Общие вопросы Javascript 7 25.02.2011 02:16
Последовательность выполнения в динамическом js sovka Общие вопросы Javascript 2 18.10.2008 14:58