5

我有一个包含一堆输入字段的表格，有点像电子表格。一些输入字段使用 jQuery UI 日期选择器。还有一个按钮可以添加表格行。

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

我怀疑答案是使用 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'});
    });
});
4

1 回答 1

6

添加新行后只需重新绑定日期选择器。如果失败，请尝试“刷新”方法。

$('.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"); 
    });
于 2012-04-10T21:07:10.110 回答