Question

我正在使用bootstrap日期选择器。我需要显示多个datepicker。

Html代码：

<div class="content">
<input type="text" class="dateRangePicker" value=""/>
</div>
<div><button name="clone" value="clone"></button></div>

Js代码：

$(document).ready(function() {
$(".dateRangePicker").datepicker({
            format : 'yyyy-mm-dd',
            startDate : new Date(),
            autoclose : true,

        });     
$("button").click(function(){
var clone = $('.dateRangePicker').clone();
$('.content').append(clone);
});

});

单击按钮后，dateRangePicker克隆将附加到内容div。错误：追加inputbox datepicker不起作用。预期：在附加所有datepicker的文本框后需要工作

Answer 1

如下所示初始化datepicker，将其附加到动态创建的元素：

<强> DEMO

$('body').on('focus',".dateRangePicker", function(){
      $(this).datepicker({
            format : 'yyyy-mm-dd',
            startDate : new Date(),
            autoclose : true
      });
});

注意 - 如果$('body')对您不起作用 [有可能] ，请使用$(document)

Answer 2

在您的代码中，您正在使用代码

初始化日期选择器

$(".dateRangePicker").datepicker({
        format : 'yyyy-mm-dd',
        startDate : new Date(),
        autoclose : true,

    });

在克隆HTML以初始化新的日期选择器之后，您还需要通过按钮单击调用此代码。

Boostrap datepicker +在输入框之后它不起作用

2 个答案: