MVC partial查看jQuery datepicker删除以前的日期选择器

Question

我有一个页面，我试图将Children添加到父对象。

在页面上，我有一个链接“Add Child”，它调用ajax get，并为Child返回一个带有文本框的部分视图。在成功，我正在做一个函数，将结果添加到div的innerHTML。

在部分视图上，我有一个名为“Birthdate {id}”的出生日期的文本框，其中{id}是基于添加了多少个数字的数字。

在成功的方法，我那么做了

$("#BirthDate" + childAdded).datepicker(); 

这个伟大的工程，最新的生日日期选择器。如果我添加3个孩子，第三个孩子div的BirthDate将有一个日期选择器，但第一个和第二个将失去日期选择器。然后添加第4个将从第3个删除日期选择器。

代码：

function addChild() { 
    $.ajax({ 
    type: "GET", 
    url: "/Home/AddChild?childNumber=" + $("#CurrentNumberOfChildren").val(), 
    data: "{}", 
    contentType: "text/html", 
    dataType: "html", 
    success: function (results) { 
     var div = document.getElementById('ChildDiv'); 
     div.innerHTML += results; 
     $("#CurrentNumberOfChildren").val(parseInt($("#CurrentNumberOfChildren").val()) + 1); 
     var numberOfChildren = $("#CurrentNumberOfChildren").val(); 
     $("#BirthDate" + numberOfChildren).datepicker(); 
    } 
    }); 
} 

有谁碰到这个？

Answer 1

此行 - div.innerHTML += results; - 每次添加新的子区域时，都会重写div的全部内容。这意味着即使重写的元素使用了相同的id s等，您仍然会丢失之前在div中的元素上的事件挂钩等。我怀疑这是什么打破了您的日期选择器。

要修复它，您需要将新内容追加到已在div中的内容，而不是每次都重写整个内容。尝试更换这两行：

var div = document.getElementById('ChildDiv'); 
div.innerHTML += results; 

有了这一个：

$('#ChildDiv').append(results); 

Answer 2

从我可以看到你可能有多个元素共享相同的ID。 jQuery需要一个有效的dom才能正常工作。您可以在w3c上验证您的标记。

你可以添加部分视图的回复你的问题，也是什么版本的jquery & ui？

Answer 3

我假设你的部分视图返回所有的文本框，以前的加上新的，因为你正在用结果替换div的HTML。在这种情况下，以前的元素（添加日期选择器的元素）已从页面中删除。如果是这种情况，那么你需要重新添加日期选择器到你所有的BirthDate元素。

Answer 4

.live() – jQuery API

如何jQuey.live？

虽然选择器的变化是必要的。