日期选择器在追加行时不起作用

我有一个表格，其中有两个日期选择器和附加新行的选项。问题是当我添加一个新行datepicker不工作。日期选择器在追加行时不起作用

<script> 
$(document).ready(function() { 

    $('.txtDate22').datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: 'MM yy', 
      showButtonPanel: true, 

     onClose: function() { 
      var iMonth = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
      var iYear = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
      $(this).datepicker('setDate', new Date(iYear, iMonth, 1)); 
      $(this).datepicker('refresh'); 
     }, 

     beforeShow: function() { 
      if ((selDate = $(this).val()).length > 0) { 
       iYear = selDate.substring(selDate.length - 4, selDate.length); 
       iMonth = jQuery.inArray(selDate.substring(0, selDate.length - 5), $(this).datepicker('option', 'monthNames')); 
       $(this).datepicker('option', 'defaultDate', new Date(iYear, iMonth, 1)); 
       $(this).datepicker('setDate', new Date(iYear, iMonth, 1)); 
      } 
     } 
    }); 

    $(".txtDate22").focus(function() { 
     $(".ui-datepicker-calendar").hide(); 
     $("#ui-datepicker-div").position({ 
      my: "center top", 
      at: "center bottom", 
      of: $(this) 
     }); 
    }); 

    $(".txtDate22").blur(function() { 
     $(".ui-datepicker-calendar").hide(); 
    }); 
}); 

</script>

来源

2016-09-19 anatp_123

Datepicker没有绑定新创建的元素。我已经更新了你的答案。我所做的唯一改变是将你的元素加载到一个单独的函数中，并在加载和点击时调用它们。

function date_picker(){ 
$('.txtDate').datepicker({ 

     changeMonth: true, 
     changeYear: true, 
     dateFormat: 'MM yy', 
      showButtonPanel: true, 

     onClose: function() { 
      var iMonth = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
      var iYear = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
      $(this).datepicker('setDate', new Date(iYear, iMonth, 1)); 
      $(this).datepicker('refresh'); 
     }, 

     beforeShow: function() { 
      if ((selDate = $(this).val()).length > 0) { 
       iYear = selDate.substring(selDate.length - 4, selDate.length); 
       iMonth = jQuery.inArray(selDate.substring(0, selDate.length - 5), $(this).datepicker('option', 'monthNames')); 
       $(this).datepicker('option', 'defaultDate', new Date(iYear, iMonth, 1)); 
       $(this).datepicker('setDate', new Date(iYear, iMonth, 1)); 
      } 
     } 
    }); 
    $('.txtDate22').datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: 'MM yy', 
      showButtonPanel: true, 

     onClose: function() { 
      var iMonth = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
      var iYear = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
      $(this).datepicker('setDate', new Date(iYear, iMonth, 1)); 
      $(this).datepicker('refresh'); 
     }, 

     beforeShow: function() { 
      if ((selDate = $(this).val()).length > 0) { 
       iYear = selDate.substring(selDate.length - 4, selDate.length); 
       iMonth = jQuery.inArray(selDate.substring(0, selDate.length - 5), $(this).datepicker('option', 'monthNames')); 
       $(this).datepicker('option', 'defaultDate', new Date(iYear, iMonth, 1)); 
       $(this).datepicker('setDate', new Date(iYear, iMonth, 1)); 
      } 
     } 
    }); 
}

所以，如果你想添加类似的行为，因为你正在这样做，那么只需在这里添加这些行动。

来源

2016-09-19 19:48:37

嗯不知道你所做的更改吗？ –

@ anatp_123检查您更新的jsfiddle –

嗯，如果你的意思是这一个https://jsfiddle.net/3uhkeq1h/2/？ –

你可能不叫datepicker()新添加的元素。即使它们是相同的类，稍后添加到DOM的元素也不会自动调用该函数。

来源

2016-09-19 19:44:24 Arthur

日期选择器在追加行时不起作用

回答

相关问题