首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Flatpickr附加问题

Flatpickr附加问题
EN

Stack Overflow用户
提问于 2017-02-21 07:05:02
回答 1查看 2.6K关注 0票数 0

我正在使用一个名为Flatpickr的插件。它可以正常工作,但是当我添加on的行为并试图将其附加到另一个div时,它会在那里显示多个文本框。奇怪的是,现在我需要做的是,我是否应该在这个div中找到扁平化,如果它有更多的话,就把它移除。或者有其他的解决方案。

代码语言:javascript
运行
复制
<form id="taskForm">
    <div class="container">
        <div class="row" style="margin-top:15px;">
            <div class="panel panel-default">
                <div class="panel-body">
                    <div class="taskContent">
                        <div class="row">
                            <div class="col-lg-4">
                                <div class="form-group">
                                    <label>Date Range<sup class="text-danger">*</sup></label>
                                    <div class="input-group">
                                        <input type="text" class="form-control flatpickr" placeholder="Select Date">
                                        <div class="input-group-addon">
                                            <span class="glyphicon glyphicon-calendar"></span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <hr>
                    </div>
                    <div id="taskEmpty">
                    </div>
                    <div class="row">
                        <div class="col-lg-1 pull-right text-right">
                            <h1 class="glyphicon glyphicon-plus-sign" id="addTask" style="color:#32c24d;cursor:pointer;"></h1>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-12 col-md-12 text-center">
                            <button type="submit" class="btn btn-primary btn-submit">Create</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

这是剧本

代码语言:javascript
运行
复制
flatpickr(".flatpickr", {
    enableTime: true,
    altInput: true,
    altFormat: "j- M- Y h:i K",
    "mode": "range"
});

$("#addTask").on("click", function(event) {
    event.stopPropagation();
    var clone = $(".taskContent").clone();
    $("#taskEmpty").html(clone);
    //initialize date again
    flatpickr(".flatpickr", {
        enableTime: true,
        altInput: true,
        altFormat: "j- M- Y h:i K",
        "mode": "range"
    });

});

这是小提琴

提前感谢

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-02-25 06:30:17

它看起来像调用比例器(“.flatpickr”);创建重复的实例。

代码语言:javascript
运行
复制
const fpConf = {
enableTime: true,
altInput: true,
altFormat: "j- M- Y h:i K",
"mode": "range",
wrap: true,
allowInput: true
};

var clone = $(".taskContent").clone();

flatpickr(".taskContent .input-group", fpConf);

$("#addTask").on("click", function(event){
event.stopPropagation();

const newClone = clone.clone();
$("#taskEmpty").append(newClone);
$(newClone).find(".input-group").flatpickr(fpConf);
});

此问题由平台选择插件的chmln创建者修复。感谢他。干得好.

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/42360744

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档