Question

我需要使用jquery类选择器为动态创建的元素初始化Bootstrap-DateTimePicker的输入。

通常，我将为页面准备就绪时创建的元素初始化日期时间选择器

$('.date-picker').datetimepicker({
     format: 'D/M/YYYY',
     useCurrent: false
});

但是现在我还需要对动态创建的元素应用相同的内容。为了使它起作用，我做了以下修改

$(document).on('focus', '.date-picker', function(){
    $(this).datetimepicker({
        format: 'D/M/YYYY',
        useCurrent: false
    });
});

仅当您专注于输入然后初始化日期时间选择器时，以上代码才起作用。

上述代码的问题在于，当输入具有“格式错误”的默认值时，格式不会更改。换句话说，加载页面时，输入没有绑定到DateTime。

我试图在页面加载时调用focus()事件，但这似乎也不起作用。这就是我尝试过的

$(document).on('focus', '.date-picker', function(){
    $(this).datetimepicker({
        format: 'D/M/YYYY',
        useCurrent: false
    });
}).focus();

如何为预定义元素和页面加载后动态创建的元素初始化datetimepicker？

我创建了以下小提琴，以说明如何在页面加载https://jsfiddle.net/516zsh7b/510/时不初始化日期时间

Answer 1

嗯，最好的方法是知道如何/何时添加这些新元素并在其中添加逻辑...

如果在将元素添加到DOM时确实需要一种反应性的方法来运行一段JS代码，则可以尝试使用突变观察器（不是性能最佳的观察器）： http://ryanmorr.com/using-mutation-observers-to-watch-for-element-availability/

如何为动态添加到DOM的元素初始化DateTimePicker？

1 个答案: