我正在使用一个名为Flatpickr的插件。它可以正常工作,但是当我添加on的行为并试图将其附加到另一个div时,它会在那里显示多个文本框。奇怪的是,现在我需要做的是,我是否应该在这个div中找到扁平化,如果它有更多的话,就把它移除。或者有其他的解决方案。
<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>这是剧本
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"
});
});这是小提琴
提前感谢
发布于 2017-02-25 06:30:17
它看起来像调用比例器(“.flatpickr”);创建重复的实例。
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创建者修复。感谢他。干得好.
https://stackoverflow.com/questions/42360744
复制相似问题