Question

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

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

当我尝试添加新行时，datepicker不起作用。我不知道该怎么办。我使用此函数在我的表中添加一个新行。（实际上，我有一个带有许多表的html页面，并且每个页面都使用了datepicker）

    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);

和datepicker的代码：

$(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()。如果您只是将其添加到ajoutLigneAuTableauTransfert()函数的底部，则Datepicker足够智能。因为您在应用datepicker后正在修改ID属性，所以它正在搞乱。执行majNumLignesTabTransfert('ajout');

后，请专门调用datepicker插件

（1）删除ajoutLigneAuTableauTransfert()中的两个双重呼叫。（2）我还注意到你在最后一个配置选项的末尾添加了逗号，这将在IE中失败，技术上是javascript中的语法错误。（3）在majNumLignesTabTransfert('ajout');

之后添加datepicker调用

以下是我描述的变化，表明它正在发挥作用。在指标的javascript注释中查找// ANT-MOD。

http://jsfiddle.net/dfDNu/

Answer 2

好的，你需要使用jQuery的live()方法，所以

$('.champ_date_input_tableau').live('focusin', function() {
    $(this).datepicker();
});

现在继续添加更多元素，live也会将此绑定到新元素。

修改

据说live已被弃用，但我认为有些作品类似on。所以如果你真的一直都在使用最新版本，请继续使用那个

Answer 3

您的代码无法正常工作的原因是，当您的网页加载时，日期选择器仅连接到现有的表单项，但不会应用于新项目。添加新行时，需要确保在刚刚添加的特定项目上调用.datepicker（）函数。

根据多里安的回答，你可以动态地做到这一点，但是，DO NOT USE LIVE。（阅读文章以解释它的各种问题。从jQuery 1.7开始，它已被弃用。）相反，你需要查看on（）函数。这样的事情应该有效：

$('#BlocFormulaire').on('click', '.champ_date_input_tableau', function() {
   $(this).datepicker();
});

datepicker和动态表不使用jQuery函数

3 个答案: