Question

我正在使用daterangepicker（http://www.daterangepicker.com/），当我将其应用于'.dates'时，它工作正常。

<input class="ff-text dates" type="text">

以下内容用于将所有日期类设置为daterangepicker。

$('.dates').daterangepicker({
  "startDate": "02/15/2019",
  "endDate": "02/21/2019"
});

通过javascript添加HTML时出现问题。

<input class='ff-text dates' type='text'>

当按下按钮时，将添加HTML，HTML会按原样显示，但输入字段不是daterangefield。

任何建议将不胜感激。

Answer 1

添加html后，您需要重新运行daterangepicker。理想情况下，您应该在新输入中添加一个id，然后针对该输入运行daterangepicker

例如

var someCounterForYourInputs = 0;
functionThatAddsYourHTML() {
    someCounterForYourInputs++;
    $('wherever-youre-adding').append($('<input id="sweet_dates_'+someCounterForYourInputs+'" class="ff-text dates" type="text"/>'));
    $('#sweet_dates_'+someCounterForYourInputs).daterangepicker({
        "startDate": "02/15/2019",
        "endDate": "02/21/2019"
    });
}

或者，不需要计数器：

functionThatAddsYourHTML() {
    var newInput = $('<input class="ff-text dates" type="text"/>');
    $('wherever-youre-adding').append(newInput);
    newInput.daterangepicker({
        "startDate": "02/15/2019",
        "endDate": "02/21/2019"
    });
}

从javascript添加html时的日期范围选择器

1 个答案: