动态jQuery UI datepicker元素 [英] Dynamic jQuery UI datepicker elements

问题描述

我正在使用jQuery UI datepicker函数在我的html表单中创建许多日期字段.

I am using the jQuery UI datepicker function to create a number of date fields in my html form.

我正在使用以下代码来获取具有"datepicker"类的所有输入字段:

I am using the following code to get any input field with a 'datepicker' class to work:

$('.datepicker').each(function() {
    var id = $(this).attr('id').split('_')[0];

    if ($('#'+id+'_value').val()) { 
        var initialdate = new Date($('#'+id+'_value').val());
    }
    else {
        var initialdate = new Date();
    }

    $(this).val($.datepicker.formatDate('DD, d MM, yy', initialdate));
    $('#'+$(this).attr('id').split('_')[0]+'_value').val($.datepicker.formatDate('yy-mm-dd', initialdate));
    $(this).datepicker({
                        'dateFormat': 'DD, d MM, yy',
                        'altField': '#'+id+'_value',
                        'altFormat': 'yy-mm-dd' 
    });
});

但是，我还使用其他一些JavaScript来克隆包含多个表单元素的跨度.创建新元素时，datepicker功能不起作用.

However, I'm also using some other javascript to clone a span which contains several form elements. When the new elements are created, the datepicker function does not work.

我该怎么做才能使新的像现有的那样工作?

What can I do to make the new ones work like the existing ones?

任何建议表示赞赏.

谢谢.

推荐答案

在创建文档时可能会调用该迭代，以后添加到DOM的项不会被实例化为新的日期选择器，因此您必须显式调用.datepicker. ()在您希望启用datepicker的每个新添加的元素上.

As you are probably calling that iteration on document creation, items added to the DOM later are not instantiated as new datepickers, so you would have to explicitly call .datepicker() on each of the newly added elements you wish to enable datepicker on.

基本上，将代码从上面的迭代器移至其自己的函数，然后执行:

Basically, move the code from the iterator above to its own function, then do:

$('.datepicker').each(myDatePickerFunction($(this));

并在稍后添加的元素上调用相同的函数.

And call the same function on the elements you add later.

这篇关于动态jQuery UI datepicker元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！