如何将jQuery UI datepicker附加到动态插入的formfield？

Question

我有一个包含一堆输入字段的表,有点像电子表格.一些输入字段使用jQuery UI datepicker.还有一个用于添加表格行的按钮.

当我单击按钮添加表格行时,它会正确添加到DOM中.但是,datepicker小部件不会附加到该新行中的日期字段.

我怀疑答案是使用live() - 或者也许on() - 来调用datepicker(),但我不明白使用什么语法.下面的代码已经推动了我对jQuery理解的限制.我头疼.救命？

<script type="text/javascript">
    $(function() {
        $( ".usedatepicker" ).datepicker();
    });

    $('.rowadd').live('click',function(){
        var appendTxt = '<tr><td><input class="usedatepicker" name="something" type="text" /></td></tr>';
        $("tr:last").after(appendTxt);
    });

</script>

注2:我也试过这个,有live()和on().它似乎适用于原始字段和动态插入的字段,但偶尔(至少在Chrome中).比如,它会工作三秒钟然后停止三秒钟,然后工作三秒钟......

$(function() {
    $('.usedatepicker').live('click', function(){
        $(this).datepicker({showOn:'focus'});
    });
});

Answer 1

只需在添加新行后重新绑定日期选择器.如果失败,请尝试"刷新"方法.

$('.rowadd').live('click',function(){
        var appendTxt = '<tr><td><input class="usedatepicker" name="something" type="text" /></td></tr>';
        $("tr:last").after(appendTxt);
        $(".usedatepicker").datepicker(); // or 
        $(".usedatepicker").datepicker("refresh"); 
    });