JQuery-UI Datepicker()点击事件似乎与自定义事件冲突

Question

我对前端的一些行为有点困惑。我使用JQuery UI库中的datepicker()方法，当第一次选择日期时，我希望日历向左滑动以显示表单的其余部分。除非先单击前一个月/下一个月元素，否则效果良好。然后DOM发生变化(可能不相关)，其他事情不会发生。日历保持在其原始位置，窗体永远不会显示。这就像我编写的事件侦听器被重写了。我想我只是对javascript/jquery的事件处理有一个基本的误解。我是一个只有一点点前端经验的后端开发人员，所以如果有人能向我解释我做错了什么，我会非常感激。

下面是一个超级简化的示例，它创建了相同的行为:

HTML:

<div id="calendar"></div>

CSS:

#calendar {
    position:relative;
    left:10em; }

JS:

$(document).ready(function () {  
    $("#calendar").datepicker();  
    $("#calendar tbody td").click(function () {  
        $("#calendar").animate({  
            left: "-30px",  
            easing: 'swing'  
        });  
    });  
});  

这里是小提琴:http://jsfiddle.net/HM9ea/

Answer 1

试试这个与 onSelect :

$("#calendar").datepicker({
    onSelect: function () {
        $(this).animate({
            left: "-30px",
            easing: 'swing'
        });
    }
});

演示

---

你的代码的问题是，你试图动画的对象不存在于文档准备的状态。所以你的事件不会被触发，相反，你可以使用内置的方法select onSelect。