jQuery：在动态创建的输入上运行多个日期选择器

Question

我正在尝试并且未能将datepicker添加到动态创建的输入。

他们有不同的ID，我专门针对新的输入和调用datepicker。

在下面的jsFiddle示例中，它仅适用于第二个输入（第一个datepicker被调用），并且不适用于之后的任何其他输入。

这里是jsFiddle：http://jsfiddle.net/TJfbc/1/按加号加上更多。

注意：我知道第一个元素不会有datepicker。

Answer 1

这里有一个cleaner alternative

$(function() { 
    //append one handler to the parent to detect append actions 
    $('.action_items').on('click', '.expand', function() { 
     var $el = $(this); 
     $el.parent() 
      .clone() 
      .appendTo($el.closest('.action_items')) 
      .find('input') 
      .removeClass('hasDatepicker') 
      .each(function() { 
       newName = this.name.slice(0,6) + (parseInt(this.name.slice(6)) + 1); 
       this.name = newName; 
       this.id = newName; 
      }) 
      .datepicker(); 

     //change text, remove original handler, add the remove handler 
     $el.text('-').off('click').on('click',function(){ 
      $(this).parent().remove(); 
     }); 
    }) 
});​ 

Answer 2

http://jsfiddle.net/TJfbc/27/

你需要“刷新”先前的文本框是早已类的hasDatepicker'之前，你可以初始化一个新

new_action_item.find('.dpDate').removeClass('hasDatepicker').datepicker() 

可读性的改善：

• 不需要在new_action_item上重复调用$（），因为clone（）返回已经是jQuery的对象