Javascript日历新实例工作不一致

Javascript calendar new instance not working consistently

本文关键字：工作 不一致 实例 日历 新实例 Javascript      更新时间：2023-09-26

所以我目前正在开发一个小型网站，其中包括一个旅馆预订系统。我一直在为这个网站的可用性日历工作，这是用Javascript制作的。可用性日历的目的是向成员显示该日期旅馆的可用性(这将从数据库中提取，很可能存储在JSON数组中)，然后允许他们在界面上选择日期范围。在这个阶段，我已经有了基本的工作，但是当我调用函数changeMonth()在月份之间进行更改时，选择日期范围的能力，并使其自动更新适当的字段。

所以问题是，当我使用"<"answers">"按钮更改月份时，日历的新瞬间不会适当地更新字段。 

function changeMonth(dir){
    currMonth += dir;
    if(currMonth > 11)currMonth = 6;
    if(currMonth < 6)currMonth = 11;
    $('#calendar_table').remove();
    drawMonth(currMonth, 2014);
}

这是changeMonth()函数;到目前为止，我只想查看6月至11月。为了获得日历的新实例，我删除了之前的实例并绘制了一个新实例。最新版本的日历可在这里获得jsfiddle.net

我愿意接受替代方法的建议，以实现我目前正在更有效地完成的相同任务，我已经从jQuery UI中查看了Datepicker，但我无法找到实现我目标的方法。

问题是，如果您重新绘制日历，'a'上的事件侦听器会丢失。

改变: 

$( "a" ).on( "click", function() { //...

为:

$( "#booking_calendar" ).on( "click", "a", function() { //...
演示:

http://jsfiddle.net/hZssN/76/

引用自jQuery文档http://api.jquery.com/on/

事件处理程序仅绑定到当前选定的元素;他们必须在代码调用.on()时存在于页面上。要确保元素存在并且可以被选择，请执行event中的元素的文档就绪处理程序中的绑定页面上的HTML标记。如果新的HTML被注入到页面中，选择元素并在新HTML完成后附加事件处理程序放置到页面中。或者，使用委托事件来附加事件处理程序，如下所述。

相关文章：