VPF::Установка обработчика события для нового элемента

Xplod

Дата 28.5.2013, 20:37 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 24
Регистрация: 27.6.2007

Репутация: нет
Всего: 1

Доброе время суток!

Задача тривиальна, это плавное появление div-а(.error) вставляемого в DOM(.message) полученного через AJAX, попробовал так:

Код


$('.message .error').on('load', function(){
       $(this).fadeIn(500);
});

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

Спасибо всем кто откликнулся!

Arantir

Дата 28.5.2013, 21:13 (ссылка)

(нет голосов)

Загрузка ...

Рыбак без удочки

Профиль
Группа: Участник
Сообщений: 960
Регистрация: 18.11.2012

Репутация: 14
Всего: 55

Код


$('.message').on('load', '.error', function(){

--------------------

interface Жопа {
// ATTENTION: has to be implemented by every class of the project for proper project work
}

Arantir

Дата 28.5.2013, 21:38 (ссылка)

(нет голосов)

Загрузка ...

Рыбак без удочки

Профиль
Группа: Участник
Сообщений: 960
Регистрация: 18.11.2012

Репутация: 14
Всего: 55

Не обратил на это внимания поначалу... вообще-то, у div нет события load. Что оно должно показывать, по вашему?
load применяется к элементам, которые что-то загружают в себя http://www.w3schools.com/jsref/event_onload.asp

--------------------

interface Жопа {
// ATTENTION: has to be implemented by every class of the project for proper project work
}

Amphiluke

Дата 28.5.2013, 21:41 (ссылка)

(нет голосов)

Загрузка ...

☽

Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 35
Всего: 112

Событие load применимо не к любым элементам DOM.

Цитата (http://api.jquery.com/load-event/)

This event can be sent to any element associated with a URL: images, scripts, frames, iframes, and the window object.

Скорее, здесь нужно элемент с классом error скрыть средствами CSS и после вставки его AJAX`ом в документ применить fadeIn:

Код


.message .error {
    display:none;
}

Код


// внутри success-колбэка
$('.message .error').fadeIn(500);

Этот ответ добавлен с нового Винграда - http://vingrad.com

Xplod

Дата 28.5.2013, 22:23 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 24
Регистрация: 27.6.2007

Репутация: нет
Всего: 1

Цитата(Amphiluke @ 28.5.2013, 21:41

)

Событие load применимо не к любым элементам DOM

Верно, спасибо буду знать, но все же, через колбек, я принципиально не хочу делать, ищу элегантный и универсальный способ решения этой задачи.

Arantir

Дата 28.5.2013, 22:51 (ссылка)

(нет голосов)

Загрузка ...

Рыбак без удочки

Профиль
Группа: Участник
Сообщений: 960
Регистрация: 18.11.2012

Репутация: 14
Всего: 55

Цитата(Xplod @ 28.5.2013, 21:23

)

Если сообщения (.error) получаются многими разными ajax-запросами, то можно просто повесить вызов события для сообщений сразу на все ajax-запросы.

Код


$(document).ajaxSuccess(function() {
  $(".error").trigger("load");
});
$(".message").on("load", ".error", function() {
     // ...
});

Вообще, ивенты — только функции, вызываемые браузером либо вашим же кодом. Названия можно задавать любые и вызывать в желаемых местах.

Код


$(document).ajaxSuccess(function() {
  $(".message").trigger("ajax_happened");
});
$(".message").on("ajax_happened", function() {
     $(this).find(".error").fadeIn(500);
});

Это сообщение отредактировал(а) Arantir - 28.5.2013, 22:54

--------------------

interface Жопа {
// ATTENTION: has to be implemented by every class of the project for proper project work
}

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »