我有一个JS代码,当你改变一个字段,它调用搜索例程。问题是,当Datepicker更新输入字段时,我找不到任何将触发的jQuery事件。
由于某种原因,当Datepicker更新字段时,没有调用更改事件。当日历弹出时,它会改变焦点,所以我也不能使用它。什么好主意吗?
我有一个JS代码,当你改变一个字段,它调用搜索例程。问题是,当Datepicker更新输入字段时,我找不到任何将触发的jQuery事件。
由于某种原因,当Datepicker更新字段时,没有调用更改事件。当日历弹出时,它会改变焦点,所以我也不能使用它。什么好主意吗?
当前回答
您可以使用datepicker的onClose选项,并将更改代码放在其中。当datepicker模式关闭时触发。我试图触发变化事件,但这不会工作,所以我把我的代码内的onClose代替,它工作。同样的方法也适用于onSelect,如果你需要在选择日期时触发。
$('#el').datepicker({
onClose: function () {
// code here
}
});
日期选择选项https://api.jqueryui.com/datepicker/
其他回答
我写这篇文章是因为我需要一个解决方案来仅在日期改变时触发事件。
这是一个简单的解决办法。每次对话框关闭时,我们都会测试数据是否发生了变化。如果存在,则触发自定义事件并重置存储的值。
$('.datetime').datepicker({
onClose: function(dateText,datePickerInstance) {
var oldValue = $(this).data('oldValue') || "";
if (dateText !== oldValue) {
$(this).data('oldValue',dateText);
$(this).trigger('dateupdated');
}
}
});
现在我们可以为那个自定义事件连接处理程序了……
$('body').on('dateupdated','.datetime', function(e) {
// do something
});
如果你正在使用wdcalendar,这将帮助你
$("#PatientBirthday").datepicker({
picker: "<button class='calpick'></button>",
onReturn:function(d){
var today = new Date();
var birthDate = d;
var age = today.getFullYear() - birthDate.getFullYear();
var m = today.getMonth() - birthDate.getMonth();
if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
age--;
}
$('#ageshow')[0].innerHTML="Age: "+age;
$("#PatientBirthday").val((d.getMonth() + 1) + '/' + d.getDate() + '/' + d.getFullYear());
}
});
事件onReturn为我工作
希望这对你有所帮助
我的soluthion:
var $dateInput = $('#dateInput');
$dateInput.datepicker({
onSelect: function(f,d,i){
if(d !== i.lastVal){
$dateInput.trigger("change");
}
}
}).data('datepicker');
$dateInput.on("change", function () {
//your code
});
我的解决方案是:
events: {
'apply.daterangepicker #selector': 'function'
}
我知道这是一个老问题。但是我不能得到jquery $(this).change()事件正确地点燃onSelect。所以我用下面的方法通过vanilla js来触发change事件。
$('.date').datepicker({
showOn: 'focus',
dateFormat: 'mm-dd-yy',
changeMonth: true,
changeYear: true,
onSelect: function() {
var event;
if(typeof window.Event == "function"){
event = new Event('change');
this.dispatchEvent(event);
} else {
event = document.createEvent('HTMLEvents');
event.initEvent('change', false, false);
this.dispatchEvent(event);
}
}
});