javascript - datepicker和动态表不使用jQuery函数

Question

我在这里阅读了很多关于我的问题的帖子，但我还没有找到解决方案，可能是因为我不是 JQuery 之王......

这是一个非常简单的例子:

example

当我尝试添加新行时，日期选择器不起作用。我不知道该怎么办。 我使用此函数在表中添加新行。 (实际上，我有一个包含许多表的 html 页面，对于每个表我都使用日期选择器)

    var champ_date_arrivee = document.createElement('input');
champ_date_arrivee.setAttribute('type','text');
champ_date_arrivee.setAttribute('size','10');
champ_date_arrivee.setAttribute('name','date_t');
champ_date_arrivee.setAttribute('value','');
champ_date_arrivee.setAttribute('id','date_t');
champ_date_arrivee.className='champ_date_input_tableau';
newCell1.appendChild(champ_date_arrivee);

以及日期选择器的代码:

$(document).ready(function(){

 $.datepicker.setDefaults($.datepicker.regional['fr']);
 $('.champ_date_input_tableau').datepicker({ /* action sur class date */

    dateFormat: 'dd-mm-yy',
    changeMonth: true,
    changeYear: true,
    yearRange: "c-70:c+70",
    clickInput:true,
 });

});

如您所见，我使用类名champ_date_input_tableau，因为我不知道如何以其他方式执行此操作。

我已经尝试过:

    var champ_date_arrivee = document.createElement('input');
champ_date_arrivee.setAttribute('type','text');
champ_date_arrivee.setAttribute('size','10');
champ_date_arrivee.setAttribute('name','date_t');
champ_date_arrivee.setAttribute('value','');
champ_date_arrivee.setAttribute('id','date_t');
champ_date_arrivee.className='champ_date_input_tableau';
    $(champ_date_arrivee).datepicker({
    dateFormat: 'dd-mm-yy',
    changeMonth: true,
    changeYear: true,
    yearRange: "c-70:c+70",
});
newCell1.appendChild(champ_date_arrivee);

您可以通过此链接 this try 获得结果 这不起作用。

我知道我必须使用这样的代码，但是如何使用？

 jQuery('.date-pick').removeClass('hasDatepicker').datepicker({
dateFormat: 'mm-dd-yy'
});

你是我最后的机会...

抱歉我的英语不好，我是法国人。

感谢您的帮助。

Answer 1

您实际上并不需要 .on()、.delegate() 或 .live()。如果您只需将 Datepicker 添加到 ajoutLigneAuTableauTransfer() 函数的底部，它就足够智能了。因为您在应用日期选择器后修改了 ID 属性，所以会造成困惑。具体在执行 majNumLignesTabTransfert('ajout');

后调用 datepicker 插件

(1) 删除 ajoutLigneAuTableauTransfert() 中的两个双倍调用。 (2) 我还注意到您在最后一个配置选项的末尾添加了逗号，这在 IE 中会失败，从技术上讲，这是 javascript 中的语法错误。 (3) 在 majNumLignesTabTransfert('ajout');

之后添加日期选择器调用

这是我描述的显示其工作原理的更改。在指标的 JavaScript 注释中查找 //ANT-MOD。

http://jsfiddle.net/dfDNu/