日期選擇器在追加行時不起作用

我有一個表格，其中有兩個日期選擇器和附加新行的選項。問題是當我添加一個新行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

日期選擇器在追加行時不起作用

回答

相關問題