不工作datepicker（引导）？

Question

将显示在输入日历（日期选择器（引导程序））中。 的问题是，在前者的情况下，它出现：

<input type="text" class="datepicker_goal" data-provide="datepicker" value="Period"> 

$('.modal-body input[data-provide="datepicker"]').datepicker(); 

但我有当您激活另一种形式的标签，并添加创建一个模式窗口：

<input type="text" class="datepicker_goal_modal" data-provide="datepicker_modal" value="Period"> 

$('.modal-body input[data-provide="datepicker_modal"]').datepicker(); 

但在第二实施例中，日期选择器未激活且日历不可见。甚至冲突的东西关闭模态窗口。 告诉我我做错了什么，以及如何解决它？如何以所有字段模式形式显示日历？

Answer 1

这里是工作Jsfiddle作为参考。它具有附加到输入字段的模式弹出和日期选择器。 （ “datepicker_goal_modal”）。

$('input[data-provide="datepicker"]').datepicker();  

// Append New Input field 
$("div.modal-body").append(" <input type=\"text\" class=\"datepicker_goal_modal\" data-provide=\"datepicker_modal\" placeholder=\"Period\">") 

// After appending, call datepicker on input field. 
$('.modal-body input[data-provide="datepicker_modal"]').datepicker(); 

Answer 2

$('body').on('focus', '.datepicker_goal_modal', function(){ 
    $(this).datepicker(); 
});​ 

这应该有效。它之所以不会出现的原因是因为您是动态创建模式，而元素选择器函数仅适用于首次加载页面时存在的元素。