Question

编辑：我能够在克隆表单元素上获取日期选择器，但是当我选择日期时，日期将填充在第一个div表单元素上，而不是克隆表单元素

我在克隆表单元素上显示日期选择器时遇到问题。

我初始化了一个div（PopupReset div中有一个jsp表单）。

当点击一个按钮时，我正在复制并在另一个名为＆＃34; Popup＆＃34;的div中显示PopupReset的内容。作为模态对话框。

<div id="PopupReset" style="display:none;">
<jsp:include page="Popup.jsp"></jsp:include>
</div>


<div id="Popup" style="display:none"></div>

当我查看源代码时，两个div中的

datepicker看起来都一样。但是，datepicker正在开发第一个div＆＃34; PopupReset＆＃34;因为它不是工作模式对话框，它具有＆＃34; PopupReset＆＃34;的副本。 HTML

 <input type="text" name="enteredOn" size="10" maxlength="10" value="" id="_enteredOn" 
 class="enterDate hasDatepicker">

  jQuery( ".enterDate" ).datepicker({
        showOn: "focus",
        changeMonth: true,
        changeYear: true,
        dateFormat: dateFormat(),
        yearRange: "1901:-0"

        });

由于对要求的某些限制，我正在克隆表格。

请分享有关如何解决此问题的任何想法。

感谢您的帮助！

谢谢你，斯

Answer 1

你没有包含javascript调用来初始化datepicker，但我想问题是第二个datepicker是动态创建的。在这种情况下，您必须调整javascript / jQuery，例如像这样：

$('body').on('click',".enterDate", function(){
 $(this).datepicker();
});

这称为事件委托：click-event绑定到body-element，它将click-event委托给所有带有类＆＃34; datepicker＆＃34;的元素，即使它们不是出现在实际文件中，但稍后补充。

更新：将班级名称调整为已调整问题的班级名称。

Answer 2

编辑：我能够在克隆表单元素上获取日期选择器，但是当我选择日期时，日期将填充在第一个div表单元素上，而不是克隆表单元素

$(".enterDate").removeClass('hasDatepicker').datepicker();

为我工作。

参考： Why does jQuery UI's datepicker break with a dynamic DOM?

谢谢Kishore我赞成你的回答，谢谢你matthia_h

克隆的表单元素上的jquery datepicker

2 个答案: