Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 19.02.2014, 12:21   #1
Gagapsha
Новичок
Джуниор
 
Регистрация: 19.02.2014
Сообщений: 1
По умолчанию Блокирование события

Здравствуйте. Разбираю простой пример карусели картинок.

Код:


	$(".b-carousel-button-right").click(function(){ // при клике на правую кнопку запускаем следующую функцию:
	$(".h-carousel-items").animate({left: "-222px"}, 200); // производим анимацию: блок с набором картинок уедет влево на 222 пикселя (это ширина одного прокручиваемого элемента) за 200 милисекунд.
	setTimeout(function () { // устанавливаем задержку времени перед выполнением следующих функций. Задержка нужна, т.к. эти ффункции должны запуститься только после завершения анимации.
	$(".h-carousel-items .b-carousel-block").eq(0).clone().appendTo(".h-carousel-items"); // выбираем первый элемент, создаём его копию и помещаем в конец карусели
	$(".h-carousel-items .b-carousel-block").eq(0).remove(); // удаляем первый элемент карусели		
	$(".h-carousel-items").css({"left":"0px"}); // возвращаем исходное смещение набора набора элементов карусели
		}, 200);
	});
Подскажите как "отключить" обработку события на кнопке до завершения анимации? Спасибо
Gagapsha вне форума Ответить с цитированием
Старый 19.02.2014, 15:27   #2
PathTheir
Пользователь
 
Аватар для PathTheir
 
Регистрация: 14.04.2013
Сообщений: 62
По умолчанию

Выделить внутреннюю часть в отдельную функцию
Код:
function rotate() {
$(".b-carousel-button-right").off('click');

$(".h-carousel-items").animate({left: "-222px"}, 200); // производим анимацию: блок с набором картинок уедет влево на 222 пикселя (это ширина одного прокручиваемого элемента) за 200 милисекунд.
	setTimeout(function () { // устанавливаем задержку времени перед выполнением следующих функций. Задержка нужна, т.к. эти ффункции должны запуститься только после завершения анимации.
	$(".h-carousel-items .b-carousel-block").eq(0).clone().appendTo(".h-carousel-items"); // выбираем первый элемент, создаём его копию и помещаем в конец карусели
	$(".h-carousel-items .b-carousel-block").eq(0).remove(); // удаляем первый элемент карусели		
	$(".h-carousel-items").css({"left":"0px"}); // возвращаем исходное смещение набора набора элементов карусели
		}, 200);

        $(".b-carousel-button-right").click(rotate);
}

(".b-carousel-button-right").click(rotate);
Замените ваш старый код на этот

Последний раз редактировалось PathTheir; 19.02.2014 в 17:41. Причина: исправление досадной ошибки
PathTheir вне форума Ответить с цитированием
Старый 19.02.2014, 17:18   #3
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Цитата:
Сообщение от PathTheir Посмотреть сообщение
Выделить внутреннюю часть в отдельную функцию
Код:
function rotate() {
$(".b-carousel-button-right").remove('click');

$(".h-carousel-items").animate({left: "-222px"}, 200); // производим анимацию: блок с набором картинок уедет влево на 222 пикселя (это ширина одного прокручиваемого элемента) за 200 милисекунд.
	setTimeout(function () { // устанавливаем задержку времени перед выполнением следующих функций. Задержка нужна, т.к. эти ффункции должны запуститься только после завершения анимации.
	$(".h-carousel-items .b-carousel-block").eq(0).clone().appendTo(".h-carousel-items"); // выбираем первый элемент, создаём его копию и помещаем в конец карусели
	$(".h-carousel-items .b-carousel-block").eq(0).remove(); // удаляем первый элемент карусели		
	$(".h-carousel-items").css({"left":"0px"}); // возвращаем исходное смещение набора набора элементов карусели
		}, 200);

        $(".b-carousel-button-right").click(rotate);
}

(".b-carousel-button-right").click(rotate);
Замените ваш старый код на этот
Это где ты такую чушь вычитал, что .remove() убивает слушателя события?

По теме: вместо назначения-удаления событий лучше просто определять находится ли элемент в состоянии анимации
Код:
 var $blaBla = $('.bla-bla');
if ($blaBla.not(':animated')) {
  // обрабатываем клик
}
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 19.02.2014, 17:39   #4
PathTheir
Пользователь
 
Аватар для PathTheir
 
Регистрация: 14.04.2013
Сообщений: 62
По умолчанию

Naive, вот черт. Я, конечно, .off() имел ввиду, но это не оправдание.
PathTheir вне форума Ответить с цитированием
Старый 19.02.2014, 18:05   #5
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Цитата:
Сообщение от PathTheir Посмотреть сообщение
Naive, вот черт. Я, конечно, .off() имел ввиду, но это не оправдание.
В любом случае назначать и снимать обработчики не лучшая практика. В частности поэтому и рекомендуют юзать живые события.
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 19.02.2014, 18:06   #6
PathTheir
Пользователь
 
Аватар для PathTheir
 
Регистрация: 14.04.2013
Сообщений: 62
По умолчанию

Naive, спасибо, приму к сведению.
PathTheir вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
блокирование доступа Che Guevara PHP 2 18.10.2010 16:24
События в WPF. Обращение к компонентам формы из события Casper-SC Общие вопросы .NET 3 25.07.2010 19:03
блокирование клавиатуры transserg Win Api 6 01.04.2010 11:06
Блокирование клавиатуры Milly Assembler - Ассемблер (FASM, MASM, WASM, NASM, GoASM, Gas, RosAsm, HLA) и не рекомендуем TASM 1 18.10.2007 19:15
блокирование функции Fireleo Win Api 5 29.07.2007 17:04