Question

我是Flatpickr的新手。

有人可以在jsfiddle中显示“ flatpickr +外部元素”如何工作吗？

我在页面上有4/5文本输入。我正在使用

将这些文本输入转换为flatpicker

/* flatpickr initialisation */
$(document).ready(function () {
     $('.datetime').flatpickr({
            noCalendar: false,
            enableTime: true,
            allowInput: true,
            dateFormat: 'M d, Y h:i K',
            minuteIncrement: 1,

        });
});

在我的html页面中，我有类似html的html， / * HTML页面* /

<input name="endtDate" type="text" class="datetime" placeholder="Select Date.." data-input> 
<a class="input-button" title="toggle" data-toggle>
    <i class="icon-calendar"></i>
</a>
<a class="input-button" title="clear" data-clear>
    <i class="icon-close"></i>
</a>

....

如果我不添加 wrap：true ，则一切正常。

如果我添加添加 wrap：true ，那么我会遇到JS错误，并且flatpickr无法呈现。

错误：无效的输入元素指定为空

你能告诉我我在做什么错吗？

谢谢。

Answer 1

Flatpickr文档完全没有解释，但是您要做的是“包装”另一个元素中的元素，并将 that 元素传递给flatpickr（）函数。这就是“ wrap：true”中的“ wrap”所指。

<div class="datetime">
    <input name="endtDate" type="text" placeholder="Select Date.." data-input> 
    <a class="input-button" title="toggle" data-toggle>
        <i class="icon-calendar"></i>
    </a>
    <a class="input-button" title="clear" data-clear>
        <i class="icon-close"></i>
    </a>
</div>

Flatpickr +外部元素不起作用

1 个答案: