Question

我已经写完了所有代码。我不完全确定你是否需要看到它以获得一个想法。

基本上我使用的是基本的：

$("#formToLoadPageInto").load("thePageToLoad.php").fadeIn("fast");

现在，它可以正常工作，但加载的页面有一个表单。它在第一次使用（提交表单）之前必须使用该加载，但之后（当它重新加载该代码时）重新加载的页面上的表单不再提交。我已经读到你不应该在$(document).ready(function(){身体中放置这样的东西，但它实际上一直都在那之外。所以我真的不确定会出现什么问题。

一切都是基于不刷新页面。到目前为止，我已经成功实现了这个目标，但是这个问题（以及一些相关的问题）阻碍了我！希望有人能帮帮我..

修改

也许这会有所帮助：

我有2个不同的div - “发表评论”和“发表评论”。

帖子评论div有一个表单来提交评论。这是一个加载到div的php页面。这很好用。提交表单时，它使用以下代码：

$("#newpost").validate({
        debug: false,
        submitHandler: function(form) {
            // do other stuff for a valid form
            $.post('postthought.php', $("#newpost").serialize(), function(data) {
                $('#hideload').html(data);
            });
        }
});

在运行之后，我尝试重新加载已发布的注释div（其中包含一个表单，在php中，加载所有已发布的注释以查看和删除）

$("#formToLoadPageInto").load("thePageToLoad.php").fadeIn("fast");

如前所述。它工作并显示新内容，但我不能使用此页面上的表单来查看或删除评论..

希望这不会太混乱..

Answer 1

如果表单本身被替换，您将需要重新应用表单提交的处理程序，或者使用委托给未被替换的元素（可能是文档本身）的处理程序。

$('#formToLoadPageInto').on('submit','form', function() {
     ... do submission...
     $('#formToLoadPageInto').load('thePageToLoad.php').fadeIn('fast');
});

Answer 2

$("#formToLoadPageInto").empty().load("thePageToLoad.php?" + Math.random()).fadeIn("fast");

Answer 3

听起来像“发布的评论”div（其中包含一个用于查看/编辑的新表单）被插入到DOM中，但是您没有初始化其JavaScript控件。

例如，如果表单有一个注释列表和每个注释的“编辑”按钮，DOM就绪处理程序中的这样的东西将起作用：

$('#formToLoadPageInto').on('click','form input[name="editButton"]', function() {
    var $this = $(this);
    var formData = {
        commentID: $this.val(), 
        commentBody: $this.siblings('textarea').text()
    };
    $.post('editComment.php', formData, function(response) {
        //....
    });
});

（这使用委托将单个事件处理程序“预先连接”到与给定选择器匹配的所有当前和随后插入的控件。）

如何使用包含表单的jquery / ajax正确刷新div？

3 个答案: