Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Установка обработчика события для нового элемента

Автор: Xplod 28.5.2013, 20:37

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

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

Код


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

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

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

Автор: Arantir 28.5.2013, 21:13

Код


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

Автор: Arantir 28.5.2013, 21:38

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

Автор: Amphiluke 28.5.2013, 21:41

Событие 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://ru.vingrad.com//object-id51a4ebbf6ccc190658000002#findElement_E7045_51a4fa406ccc19805f00031d_0

Автор: Xplod 28.5.2013, 22:23

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

)

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

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

Автор: Arantir 28.5.2013, 22:51

Цитата(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);
});