要获取在input
中选择的日期,我正在使用data range picker
我遇到的问题是,克隆input
时,date函数不再起作用,而且我似乎无法弄清楚自己在做什么错。
看来我只能执行一次数据选择器功能。
$(function() {
$('input[name="opl_datum"]').daterangepicker({
autoUpdateInput: false,
showDropdowns: true,
autoApply: true,
locale: {
format:'DD/MM/YYYY',
daysOfWeek: [
'Zo',
'Ma',
'Di',
'Wo',
'Do',
'Vr',
'Za',
]
}
});
$('input[name="opl_datum"]').on('apply.daterangepicker', function(ev, picker) {
$(this).val(picker.startDate.format('DD/MM/YYYY') + ' - ' + picker.endDate.format('DD/MM/YYYY'));
});
$(document).on('click', '.btn-add', function(e) {
e.preventDefault();
var controlForm = $(this).closest('.controls').find('form:first'),//you have to select colsest controls
currentEntry = $(this).parents('.entry:first'),
newEntry = $(currentEntry.clone()).appendTo(controlForm);
newEntry.find('input').val('');
controlForm.find('.entry:not(:last) .btn-add')
.removeClass('btn-add').addClass('btn-remove')
.removeClass('btn-success').addClass('btn-danger')
.html('<span class="icon_minus_alt2"></span>');
}).on('click', '.btn-remove', function(e) {
$(this).parents('.entry:first').remove();
e.preventDefault();
return false;
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
<div class="controls">
<form class="school_form" role="form" autocomplete="off">
<div class="entry input-group">
<input type="text" name="opl_datum" placeholder="Periode">
<input type="text" name="diploma" placeholder="Certicicaat/diploma">
<input type="text" name="school" placeholder="School/Hoge School/ Universiteit">
<span class="input-group-btn">
<button class="btn btn-success btn-add" type="button">
<span>Voeg opleinding toe</span>
</button>
</span>
</div>
</form>
</div>
答案 0 :(得分:1)
默认情况下,jQuery的clone方法不会克隆事件处理程序和与DOM节点关联的数据,而只会克隆节点本身。您还必须将特定的参数(withDataAndEvents and deepWithDataEvents)传递给clone
才能复制这些参数。