引导程序 3 日期时间选取器在容器被 ajax 获取后不会触发

Question

我正在使用bootstrap 3 datetimepicker组件。我正在使用结构：

$('.datetimepickerbutton').datetimepicker({
    format: 'DD.MM.YYYY'
});

它工作正常，直到我将通过ajax发送内容。Ajax 形式在 .myDatediv 中，它是 targer id。我应该如何使用jquery的"on"方法来让我的代码也为ajax工作？我尝试使用：

$(".dataPoczatku").on("load", function () {
    $('.datetimepickerbutton').datetimepicker({
        format: 'DD.MM.YYYY'
    });
});

但是现在我的日期时间选择器从未显示过....

我的问题看起来像主题类似主题 让引导日期时间选择器在 ajax 加载后工作，但我所有的剥离链接都在脑海中，在这种情况下它没有帮助。

Answer 1

为什么不在 ajax 成功后初始化日期选择器。像下面的实例：

$.ajax({
  url: "test.html",
  context: document.body
}).done(function() {//success function now you can initialize datepicker
  $('.datetimepickerbutton').datetimepicker({
    format: 'DD.MM.YYYY'
  });
});

如果您的 ajax 调用发生多次，则可能需要在初始化之前使用 $('.datetimepickerbutton').datetimepicker('remove');。我建议你使用ID而不是Class（.datetimepickerbutton），这样它只会影响特定的元素。

Answer 2

另一种类型的调用：

var posting = $.post( url, data );
posting.done(function(output){
  $('#main-content').html(output).find('#datepicker').datepicker(datepickerOptions());
});
$('#main-content').load(this_file + ' #div' + this_id, {
  'id': this_id,
  'name': this_name
}, function(){
  $(this).find('#datepicker').datepicker(datepickerOptions())
});
function datepickerOptions() {
  var ToEndDate = new Date();
  return {
        todayBtn: true,
        orientation: "top left",
        autoclose: true,
        todayHighlight: true,
        endDate: ToEndDate,
      }
}

你可以对"load"或任何类型的ajax调用做同样的事情。

我在显示日期选择器时遇到问题：仅在第二次单击时显示，即：当我获得焦点时。这工作正常。

感谢您的解决方案@Manwal它帮助了我。