Создание datepicker live-JQuery

Я знаю, когда вы создаете элемент динамически, вы должны использовать что-то вроде:

$("#id").live("click", function() {
    //something
});

сейчас у меня есть это:

$('#tdInput1').datepicker({
    inline: true
});

мой вопрос: как мне это сделать live таким образом, он может взаимодействовать с динамически созданными элементами.

7
datepicker jquery jquery-ui

4 ответов

по: С помощью jQuery .видео работает, но не со .datepicker

Это должно работать:

$("#tdInput1").live("click", function(){
    $(this).datepicker({ 
        inline: true 
    });
});

edit: этот ответ для более старых версий jQuery. Для jQuery 1.9+, пожалуйста, попробуйте ответ Вишала.

11

принятое решение не будет работать с событиями фокусировки клавиатуры.. поэтому мне пришлось перейти к следующему:

$('.parent').on('focusin', '.datepicker', function(e) {
    $(this).datepicker(options);
});

пришлось менять .live to .on поскольку jquery 1.9.1 не включает .live метод. Выше работает для событий мыши, а также в фокусе событий.

19

Вы имеете дело с двумя разными вещами. в jQuery live для привязки событий, в то время как datepicker не привязан специально к событию, а просто добавляет функциональность к элементу в данный момент времени.

единственная причина live работа с событиями заключается в том, что jQuery фактически присоединяет обработчик событий к элементу предка, и (благодаря тому, как события всплывают в javascript) предок фактически получает событие и делегирует его, как если бы он пришел из элемента. Принцип довольно сложный, но длинный и короткий, он может работать только с событиями.

если вы хотите добавить функциональность datepicker, просто вызовите datepicker функция для нового элемента после его создания.

7

Я думаю, что более правильное решение такое:

$('input.datepickerClass').live('focus', function(){
    if (false == $(this).hasClass('hasDatepicker')) {
        $(this).datepicker({ options });
    }
});
0