jQuery. Как выбрать живой созданный элемент?

Вот код:jQuery. Как выбрать живой созданный элемент?

helpers.ajaxModuleFormRequest('blockcallback', $(this), function() { 
     var timer = $('[data-timer]'); 
     var seconds = timer.data('timer'); 

     var interval = setInterval(function() { 
      if (seconds == 0) { 
       clearInterval(interval); 
      } 
      timer.text(seconds); 
      seconds--; 
     }, 1000); 
    });

helper.ajaxModuleFormRequest() делает AJAX-запрос, а затем в $ .ajax.done() метод вызывает обратный вызов функция, заданная в 3 парах.

<div data-timer="20"></div> Вставляется в метод DOM live $ .ajax.done(), и я хочу выбрать его, чтобы запустить таймер. Но код не работает, $('[data-timer]').length возвращает 0. Как я могу это исправить?

источник

2015-07-08 Denis Gerasimov

similer вопрос [селектор для динамических элементов] (http://stackoverflow.com/questions/27976739/jquery-click -function-is-not-working-for-dynamic-elements/27976810 # 27976810) – Mritunjay

Чтобы понять проблему, нам нужно знать больше о том, как вы манипулируете div. Я создал [jsfiddle] (http://jsfiddle.net/0vpatwgc/) из вашего кода, и он отлично работает. – Matt

Там нет div в DOM при загрузке страницы. Он вставлен в DOM после запроса AJAX. –

Вот упрощенный пример, который вставляет <div> динамически, а затем запускает таймер:

HTML:

<html> 
<head>Testpage</head> 
<body></body> 
</html>

JavaScript:

{ 
    $('body').append('<div data-timer="20"></div>'); 
    var timer = $('[data-timer]'); 
    var seconds = timer.data('timer'); 
    if (seconds!==undefined) 
    { 
     alert(seconds); 
     var interval = setInterval(function() { 
      if (seconds == 0) { 
       alert('elapsed!'); 
       clearInterval(interval); 
      } 
      timer.text(seconds); 
      seconds--; 
     }, 1000); 
    } 
    else 
    { 
     alert("Please specify a timer value!"); 
    } 
}

Следует отметить, что первоначально <div> нет, это вставляется динамически через

$('body').append('<div data-timer="20"></div>');

Если вы хотите проверить тестирует ли это правильно для существования значения таймера, закомментируйте строку выше, т.е.

// $('body').append('<div data-timer="20"></div>');

и вы получите предупредительное сообщение «Пожалуйста, укажите значение таймера! ".

ПРИМЕРЬТЕ jsfiddle:

jsfiddle

{ 
 
    $('body').append('<div data-timer="20"></div>'); 
 
    var timer = $('[data-timer]'); 
 
    var seconds = timer.data('timer'); 
 
    if (seconds!==undefined) 
 
    { 
 
     alert(seconds); 
 
     var interval = setInterval(function() { 
 
      if (seconds == 0) { 
 
       alert('elapsed!'); 
 
       clearInterval(interval); 
 
      } 
 
      timer.text(seconds); 
 
      seconds--; 
 
     }, 1000); 
 
    } 
 
    else 
 
    { 
 
     alert("Please specify a timer value!"); 
 
    } 
 
}

<head>Testpage</head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

источник

2015-07-09 09:13:02 Matt

jQuery. Как выбрать живой созданный элемент?

ответ

Смежные вопросы