通过ajax获取容器后，Bootstrap 3 datetimepicker不会触发答案

【问题标题】：Bootstrap 3 datetimepicker doesn't trigger after container is get by ajax通过ajax获取容器后，Bootstrap 3 datetimepicker不会触发
【发布时间】：2015-04-27 16:53:32
【问题描述】：

我正在使用 bootstrap 3 datetimepicker 组件。我正在使用建筑：

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

它工作正常，直到我将通过 ajax 发送内容。 Ajax 表单位于 .myDate div 中，它是目标 ID。我应该如何使用 jquery 的“on”方法让我的代码也适用于 ajax？我尝试过使用：

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

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

我的问题看起来类似于主题Get Bootstrap datetimepicker to work after ajax loaded，但我所有的脱衣舞链接都在头上，在这种情况下没有帮助。

【问题讨论】：

你能显示你的ajax代码吗？

标签： jquery ajax twitter-bootstrap datetimepicker

【解决方案1】：

为什么不在ajax 成功后初始化datepicker。像下面的例子：

$.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)，这样它只会影响特定的元素。

【讨论】：

在我的例子中，有一些日期框是动态生成的，所以我不能使用 Id 代替 Class。但是成功实施它解决了我的问题，非常感谢您的帮助。

【解决方案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,
      }
}

您可以对“加载”或任何类型的 ajax 调用执行相同的操作。

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

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

【讨论】：