在jQuery .html（）更新中，其他function停止工作

我的网站上有一些可以排序的“页面”。 它们还会自动更新到数据库。

在我的li列表被排序之后，调用一个php页面来重新排序“pages”然后我调用.html(data)来改变页面上显示的页面的顺序。

但是，执行此操作后，我的自动更新function在我的javascript停止工作。

有一个#form1在排序发生之前工作，并调用.html(data) 。 一旦调用，之前的#form1 get被删除并重新添加到页面中。 这是它停止工作的时候。

有谁知道这个的原因？

我的更新脚本

 $("#reportNav").sortable({ stop : function(event, ui){ var postData = $(this).sortable('serialize'); var url = "saveOrder.php"; $.ajax({ type: "POST", url: url, data: postData, success: function(data) { $('#reportContainer').html(data); }, error: function(data) { $changesSaved.text("Could not re-order pages."); } }); } }); 

什么停止工作/停止被调用

 var timeoutId; $('#form1').on('input propertychange change', function() { clearTimeout(timeoutId); timeoutId = setTimeout(function() { // Runs 1 second (1000 ms) after the last change $("#form1").submit(); }, 1000); }); 

Answer 1

可能是覆盖了处理程序绑定的元素的情况，在这种情况下，您需要事件委派：

 $('#reportContainer').on('input propertychange change', '#form1', function() {