jquery - 日期选择器和时间选择器不适用于附加元素

Question

我正在使用datepicker和timepicker我的领域是这样的：

<input class="datepicker" name="sugg_date[]" type="text" value="" />
<input class="tp" name="sugg_time[]" type="text" value="" />

我也在使用这个函数来添加更多行：

<script>
    function add_next_row(e, row_a) {
        curr_row = $(row_a).prev('p');
        curr_row.append('<input class="datepicker" name="sugg_date[]" type="text" value="" />');
        curr_row.append('<input class="tp" name="sugg_time[]" type="text" value="" />');

        if (e.preventDefault) {
            e.preventDefault();
        } else {
            e.returnValue = false;
        }
    }
</script>

但是新行不适用于timepickerand datepicker。有人可以告诉我为什么。

Answer 1

您需要为添加的每个新元素初始化datepicker和timepicker。尝试这个：

function add_next_row(e, row_a) {
    e.preventDefault();

    var $datefield = $('<input class="datepicker" name="sugg_date[]" type="text" value="" />').datepicker();
    var $timefield = $('<input class="tp" name="sugg_time[]" type="text" value="" />').timepickr({convention:12}); 

    curr_row = $(row_a).prev('p');
    curr_row.append($datefield);
    curr_row.append($timefield);
}

Answer 2

    function add_next_row(e, row_a) {

    if (e.preventDefault) {
        e.preventDefault();
    } else {
        e.returnValue = false;
    }
    curr_row = $(row_a).prev('p');
    var $datefield = $('<input class="datepicker" name="sugg_date[]" type="text" value="" />').datepicker();
    var $timefield = $('<input class="timepickr" name="sugg_time[]" type="text" value="" />');
    curr_row.append($datefield);
    curr_row.append($timefield);
    curr_row.append("<br/>");


    $(".timepickr").timepickr().timepickr({convention:12});


}