无法重建对生成的html

Question

日期选择器产生新的html内容后，我做的事：

var el_1 = $('.index_1').html(); 

$('#payment_block_content').html(el_1); 

这el_1有一个数据字段：

<input class="datepicker form-control hasDatepicker" id="id_date" name="date" type="text" /> 

我怎么能刷新这个日期选择？接下来我尝试：

$("#id_date").on('focus', function(){ 
    $(this).datepicker(); 
}); 

Answer 1

设置HTML后，您可以直接初始化.datepicker()。

此外，您需要删除hasDatepicker CSS类作为其内部由jQuery UI组件使用以标识.datepicker()应用于该元素。

$('#payment_block_content').html(el_1); 
$("#id_date").removeClass('hasDatepicker').datepicker(); 

var html = '<input class="datepicker form-control" id="id_date1" name="date" type="text" />'; 
 
$(document.body).append(html); 
 
$("#id_date1").datepicker(); 
 

 

 
var html2 = '<input class="datepicker form-control hasDatepicker" id="id_date2" name="date" type="text" />'; 
 
$(document.body).append(html2); 
 
$("#id_date2").removeClass('hasDatepicker').datepicker();

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>