31
我有一个动态的DOM在这里工作，并调用了jQuery UI的日期选择器与一个特定的类名称的所有投入，在这种情况下.date为什么jQuery UI的datepicker与动态DOM断开？
它与第一，静态的伟大工程，构建但是当我克隆事件处理程序似乎不想移动。我得到的萤火虫错误：
inst is undefined
我试图寻找到jQuery的新live()功能，但不能将二者结合起来。有任何想法吗？
A
回答
38
啊，明白了。在将HTML附加到DOM后，我在所有输入上运行这个输入，我希望有一个datepicker弹出。 Datepicker为它所附带的元素添加一个类，因此我们可以过滤掉现有的输入并且仅将其应用于新的输入。
$('.date').not('.hasDatePicker').datepicker();
我希望这可以帮助人，因为我是谷歌搜索了几天，没发现什么！
您还应该注意，通过将生成的HTML设置为上下文而不是整个页面来检查input.date会更快，因为这会节省时间，因为这是一种更高效的操作。
6
我有一个类似的问题，我有一个页面上的多个表，每个有多个日期选择器，也点击按钮“AddLine”它添加了一个表格行与动态HTML和日期选择器。
我很多的搜索，我的日期输入，没有“身份证”定义他们看上去像这样
<input type="text" class="datepicker" name="mDate1" value="" size=8 >
：jQuery是所有日期字段的值指向第一个日期字段页面上定义后实现，日历会弹出上的所有日期字段，但第一个日期字段的值会发生变化，我加入了“身份证”了这样的
<input type="text" class="datepicker" id="Date1" name="mDate1" value="" size=8 >
更改HTML和它开始工作，为动态日期字段我改变这样的Id这样的
个var allColumns = $("#"+$tableId+" tr:last td");
$(allColumns).each(function (i,val) {
if($(val).find(":input").hasClass("datepicker")){
$(val).find(":input").attr("id",newId+$(val).find(":input").attr("id"));
}
});
2
使用jQuery选择：
$(".mydatepicker:not(.hasDatepicker)").datepicker()
0
我经历了同样的症状，在该致具有包含元件具有相同id属性作为输入一个TD，
<td id="fld_xyz"><input id="fld_xyz" class="date" /></td>
我无论如何，这并不理想，但值得一提的是，datepicker组件似乎依赖于id的唯一性。
0
我有这个问题。我的情况最终是因为我有另一个具有与datepicker输入相同的ID的元素。
3
使用
$j(id or class).removeClass('hasDatepicker').datepicker();
据工作
4
你需要使用“现场”活动，使之与动态DOM工作。所以，如果您的日期选择器输入类是“日期输入”，下面的代码将使其工作：在jQuery的UI库的页面上
$(document).ready(function() {
$('.date-input').live('click', function() {
$(this).datepicker('destroy').datepicker({showOn:'focus'}).focus();
});
});
1
多个实例会造成这个错误了。删除冗余实例为我的案件工作
0
今天我面临同样的问题......我在我的应用程序中使用datetimepicker插件。
也使用jquery的默认日期选择器。当我在文档准备好时调用它们时，我得到错误inst is undefined。
$(document).ready(function(){
$(".datepickerCustom").datetimepicker();
$(".datepicker").datepicker();
$("#MainForm").validationEngine('attach');
....
});
所以我改变了代码文档之前调用准备象下面这样：
$(".datepickerCustom").datetimepicker();
$(".datepicker").datepicker();
$(document).ready(function(){
$("#MainForm").validationEngine('attach');
....
});
现在，每一件事情是工作的罚款。没问题。
0
如果它仍然不起作用，那是因为克隆的id。您可以像这样完全删除datepicker：$(selector).removeClass('hasDatepicker').removeAttr('id').datepicker();
0
我有一个类似的问题，数据选取器在第一次调用后不工作。我找到了答案，我的问题在这里：
http://www.stemkoski.com/problem-with-jquery-ui-datepicker-dynamic-dom/
我是动态地从模板克隆段和无意中包括日期选择器添加类一旦其称为：
hasDatepicker
我把我的第一个日期选择器调用在我克隆模板之后，就做到了。然后我加了一个日期选择器调用clone的每个实例后：
$(source).clone().appendTo(destination).find(".datepicker").datepicker();
3
这可能是晚了一点，但所有上述建议并没有为我工作，我想出了这个简单的解决办法。
首先，是什么导致问题： JQuery将日期选择器分配给元素ID。如果你是克隆元素，那么同样的id也可能被克隆。哪些jQuery不喜欢。您最终可能会收到空引用错误或分配给第一个输入字段的日期，无论您单击哪个输入字段。
解决方案：
1）破坏日期选择器 2）分配新的唯一的ID给所有输入字段 3）指定日期选择器为每个输入
确认您输入的是这样的
<input type="text" name="ndate[]" id="date1" class="n1datepicker">
克隆之前，销毁datepicker
$('.n1datepicker').datepicker('destroy');
后你克隆，添加这些行以及
var i = 0;
$('.n1datepicker').each(function() {
$(this).attr("id",'date' + i).datepicker();
i++;
});
，奇迹发生了
0
想很多，这里的答案后，这是对我工作，是表示第一次点击/集中
function vincularDatePickers() {
$('.mostrar_calendario').live('click', function() {
$(this).datepicker({ showButtonPanel: true, changeMonth: true, changeYear: true, showOn: 'focus' }).focus();
});
}
这需要您输入有类“mostrar_calendario”
住的是jQuery的1.3+的新版本你需要这个适应“的”
查看更多有关的区别就在这里http://api.jquery.com/live/
意志，非常感谢！你保存了我几个小时的生活:) – ep3static 2009-10-07 18:36:31
当我使用动态DOM时，这个解决方案并没有帮助我，当我（jQuery）克隆表事件的表行。我的解决方案是做$（'。date'）。removeClass（'hasDatepicker'）。datepicker（）; – David 2010-02-01 12:22:35
David，你使用的是什么jQuery核心和UI版本？这是分别为1.3.2和1.7，该解决方案已与其他实现工作。不管怎样漂浮你的船！ – 2010-02-01 14:41:29