[英]jQuery UI Datepicker after select/change month/year
I wanted to find out how I can run some piece of code (attach mouseenter event) for every day after user has selected a day or changed a month/year? 我想知道如何在用户选择一天或更改一个月/一年后每天运行一些代码(附加mouseenter事件)?
I have tried to attach the event on these events 我试图在这些事件上附上活动
On hover I want to highlight next day in the same row if it exists. 在悬停时,我想在同一行中突出显示第二天(如果存在)。
Currently I attach moouseenter/mouseleave event to all days after datepicker is created (which is inline). 目前,我将moouseenter / mouseleave事件附加到创建datepicker之后的所有日期(内联)。
I have simplified what I'm doing in the JS fiddle below. 我已经简化了我在JS小提琴中所做的事情。 I need to have those events working after a date is selected and after month/year has been changed.
我需要在选择日期之后以及月/年之后更改这些事件。
JS Fiddle: http://jsfiddle.net/MartinTale/Xx4GS/2/ JS小提琴: http : //jsfiddle.net/MartinTale/Xx4GS/2/
$("div").datepicker({
changeMonth: true,
changeYear: true,
inline: true,
altField: "#datep"
});
$("tbody td:not(.ui-state-disabled, .active-calendar-cell)").mouseenter(function (e) {
$(this).closest('td').next().find("a").addClass("hover-calendar-cell");
console.log('test');
});
$("tbody td:not(.ui-state-disabled)").mouseleave(function (e) {
$("a.hover-calendar-cell").removeClass("hover-calendar-cell");
console.log('test out');
});
Thanks in advance. 提前致谢。
You can use the provided jQuery datepicker events onSelect
and onChangeMonthYear
. 您可以使用提供的jQuery datepicker事件
onSelect
和onChangeMonthYear
。
Code: 码:
$("#datep").datepicker({
changeMonth: true,
changeYear: true,
onSelect: function () {
console.log('s');
},
onChangeMonthYear: function () {
console.log('o');
}
});
Demo: http://jsfiddle.net/IrvinDominin/Xx4GS/ 演示: http : //jsfiddle.net/IrvinDominin/Xx4GS/
Here is hacky hack. 这是hacky hack。
http://jsfiddle.net/Xx4GS/3/ http://jsfiddle.net/Xx4GS/3/
It works, highlights the next day( the next td
in this case). 它起作用,第二天突出显示(在这种情况下是下一个
td
)。
setTimeout is because I think jquery ui destroys the active date item, so we wait until we have the right one. setTimeout是因为我认为jquery ui会破坏活动日期项,所以我们要等到我们有正确的日期项。
You might be able to use onSelect
instead of .change
, but not a big deal imo 您可以使用
onSelect
而不是.change
,但不是很重要的imo
I left a console.log in there so you can see a little bit of whats going on. 我在那里留下了一个console.log,所以你可以看到一些正在发生的事情。
There is an event called "onSelect" having the date as its param. 有一个名为“onSelect”的事件,其日期为其参数。 see this example:
看这个例子:
$("#datePicker").datepicker({
//the format
dateFormat: "dd/mm/yy",
//called when date is selected
onSelect: function (date) {
alert(date);
}
});
Cou can find all the details in the api-doc: http://api.jqueryui.com/datepicker/#option-onSelect Cou可以在api-doc中找到所有细节: http : //api.jqueryui.com/datepicker/#option-onSelect
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.