Как обнаружить изменение в HTML-элемент в JQuery

Question

У меня есть элемент alert-message, который я хотел бы скрыть через 2 секунды. У меня есть javascript, который запускается после загрузки страницы, и он нанимает любые предупреждения, появляющиеся при загрузке страницы.

Однако, есть предупреждения, которые появляются после загрузки страницы, и эти предупреждения останутся включенными. Как я наблюдаю изменения, то есть, если элемент alert-message снова виден, чтобы скрыть его через 2 секунды?

Этот код я использовал, чтобы скрыть первое предупреждение:

$(document).ready( function(){
   var hide_delay = 4000;  // starting timeout before first message is hidden
   var hide_next = 800;   // time in mS to wait before hiding next message
   $(".alert-message").slideDown().each( function(index,el) {
      window.setTimeout( function(){
         $(el).slideUp();  // hide the message
      }, hide_delay + hide_next*index);
   });

Спасибо.

Answer 1

Звучит так, как будто вы хотите таймер? Что вы хотели бы сделать, это в конце функции / кода, который отображает предупреждение для пользователя, сделать что-то вроде этого:

var timer = window.setTimeout(function() {
   // code here to hide the alert
}, 2000);

Число 2000 указывается в миллисекундах и должно означать, что примерно через 2 секунды после создания таймера код запускается в анонимной функции, которая затем скрывает предупреждение.

Answer 2

Вот идея Fiddle: http://jsfiddle.net/ekr8v/4/

Когда вы создаете предупреждение, вы даете ему идентификатор и создаете тайм-аут (см. Код Eli Sand выше), который удалит этот идентификатор через 2 секунды.

В уроке в моей скрипке я просто использовал метку времени Unix, которая, я думаю, будет прекрасно работать здесь.

Answer 3

Я думаю, вы хотите что-то вроде события "DOMNodeInserted", но это не поддерживается в IE.Таким образом, вы можете использовать liveQuery для прослушивания изменений DOM.Надеюсь, это то, что вы ищете.

LiveQuery

Затем вы можете использовать его для прослушивания изменений элементов:

$('#elementToListenTo').livequery(function(){
    // If $(this) element has been changed, perform things below.
    var timeout = window.setTimeout(function(){
       // Perform a task after 2 seconds
        $(".alert-message").slideDown();
    },2000);
});