Javascript 日历新实例无法始终如一地工作

Question

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

所以问题是，当我使用“”按钮更改月份时，日历的新瞬间不会正确更新字段。

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，但我无法找到实现目标的方法.

Answer 1

问题是，如果您重绘日历，则“a”上的事件侦听器会丢失。

改变这个：

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

进入这个：

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

演示： http://jsfiddle.net/hZssN/76/

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

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