Javascript 将jquery datetimepicker呈现为模式时出现问题

我试图将jquery datetimepicker显示为引导模式

HTML:

当我不渲染为模态时，它工作得很好。。。

---

非常感谢您的帮助

您的问题还不清楚。模态显示了吗？或者只是datetimepicker不起作用

尝试在setTimeout调用之前添加此项

$('#availability_modal').modal('show');  

此外，如果#availability_calendar div已经在dom中，则不需要setTimeout调用

您必须在

$（“#availability_modal”）之后初始化事件。modal（'show'）日期时间选择器时，
DOM中不存在代码>作为
可用性日历

编辑：
可用性日历
应为
输入
元素而非
div
元素

试试这个：

$（'btn'）。在（'click'，function（）上{
$（'availability'u modal'）。modal（'show'）；
jQuery（“#可用性_日历”）.datetimepicker({
形成日期：“d.m.Y”，
是的，
计时器选择器：错误，
高亮显示日期：[
“2016年2月29日，与皮特会面”，
“2016年2月24日，平安夜，xdsoft\u mint”，
“2016年2月25日，圣诞节，xdsoft\u mint”，
“2016年2月26日，感恩节”
],
高光时段：[
“2015年4月27日，2015年5月8日，出差”，
“2015年7月11日，2015年8月31日，2015年暑假，xdsoft\u\u mint”，
“2015年12月21日、2016年1月1日、2015年圣诞节”
]
});
0
})


&时代；
查看%SUPP\u NAME%的可用性
接近
打开

我不知道为什么要使用
div
元素初始化
日期时间选择器
，但我建议您将该元素更改为具有相同id的表单
输入

当modal显示在浏览器中时，有一个回调，显示为
show.bs.modal
，您可以在其中初始化
datetimepicker
：


jQuery（'#availability_modal'）.on（'show.bs.modal'，function（）{
jQuery（“#可用性_日历”）.datetimepicker({
形成日期：“d.m.Y”，
是的，
计时器选择器：错误，
高亮显示日期：[
“2016年2月29日，与皮特会面”，
“2016年2月24日，平安夜，xdsoft\u mint”，
“2016年2月25日，圣诞节，xdsoft\u mint”，
“2016年2月26日，感恩节”
],
高光时段：[
“2015年4月27日，2015年5月8日，出差”，
“2015年7月11日，2015年8月31日，2015年暑假，xdsoft\u\u mint”，
“2015年12月21日、2016年1月1日、2015年圣诞节”
]
});
})

Date.parseDate=函数（输入，格式）{
返回时刻（输入，格式）.toDate（）；
};
Date.prototype.dateFormat=函数（格式）{
返回时刻（本）。格式（格式）；
};
启动演示模式
&时代；
查看%SUPP\u NAME%的可用性
接近
你能分享可执行的演示文件吗？是的，模态正在打开，但正如我所说。。datetimepicker没有渲染…我也尝试了你建议的方式…令人惊讶的是，你的小提琴工作得很好，而同一个复制品对我来说不起作用。。。不过，感谢mate的帮助…您使用的插件是bootstrap datetimepicker而不是jquery datetimepicker（）..@AshishJoshi加密的，您在问题中没有提到任何内容..我还评论了提供一个也没有提供的小提琴…我们可以使用div将其显示为内联日历。。。然而，我尝试了你的方法，但它没有初始化datetimepicker。。。也许您可以查看URL（），您是否单击了添加答案的此按钮
运行代码段
。是的，我检查了您提供的代码段，但不幸的是，它是bootsrap datetime picker而不是jquery datetimepicker（）。为什么您在问题中也没有告知这一点？更新您可以尝试此米特。
$(document).on("click","#open_availability",function(e){
    setTimeout(function(){
        jQuery('#availability_calender').datetimepicker({
         formatDate: "d.m.Y", 
         inline:true,
         timepicker:false,
         highlightedDates: [
            "29.02.2016,Meeting with Pete", 
            "24.02.2016,Christmas Eve,xdsoft_highlighted_mint", 
            "25.02.2016,Christmas Day,xdsoft_highlighted_mint", 
            "26.02.2016,Thanksgiving"
         ],
         highlightedPeriods: [
            "27.04.2015,08.05.2015,Business trip", 
            "11.07.2015,31.08.2015,Summer holiday 2015,xdsoft_highlighted_mint", 
            "21.12.2015,01.01.2016,Christmas holiday 2015"
         ]
        });
    },1000);

});

$('#availability_modal').modal('show');