Php JQuery AJAX post工作流

编辑

忘记了几个重要的要点

我这样做是为了避免页面刷新，从而跳回页面顶部

ajax函数的success函数将回退一个完整的新div id=“comments”，用错误消息替换现有的div id=“comments”，或者用下面的所有其他注释替换新的div id=“comments”

结束编辑

我一直在尝试包装这个jqueryajax函数，但没有成功。我在一个页面上有X个帖子，每个帖子下都有一个插入评论的表单。我想我已经非常接近了，并且已经尝试过使用firebug调试它，但老实说，我不知道我在firebug中看到了什么，或者为什么

所有代码如下，任何帮助都将不胜感激

HTML表单和结构（由于重复表单，我觉得应该使用父jquery选择方法，而不是在输出脚本中迭代每个post comment分区）

我主要怀疑我的jquery脚本

---

再次感谢，

在firebug中，单击console，然后单击all。当您单击按钮触发ajax调用时，您应该会看到弹出一行，可能带有一个加载图标，显示正在发送的post请求。您应该能够单击选项卡，查看发布的数据、给出的响应以及响应状态代码

---

在您的编辑中，您说success函数将发送一个新的div id=“comments”来替换现有的div id=“comments”，但正如您现在所写的，我相信它只会在现有的div id=“comments”中添加一个div id=“comments”。但是，我不知道这是否会导致您的问题。

我将一般结构放到了一个JSFIDLE中，当我提交表单时，我确实收到了一篇关于不存在的

http://fiddle.jshell.net/cori/JsLWq/show/includes/comment.php

由于相对的ajax url，所以据我所知，这不是问题所在。我认为问题在于，您混合了变量命名规则

开始时，将变量命名为普通的旧javascript对象

var form = $(this);
var div_add_comment = form.parent();
var div_comments = div_add_comment.parent();

但是，在成功处理程序中，您切换到相当常见的

$x

约定，该约定通常用于指示变量是jQuery实例：

$div_comments.html(msg);

但是，此时没有变量

$div_comments

；只有

div\u注释

。如果您在中提交表单，它有一个ajax错误处理程序，并查看firebug控制台，您将看到由于

$div_comments

未定义，因此出现了一个ReferenceError

编辑

结合kgarrigan的建议，如果在php中循环要创建的表单，并使用索引跟踪您的位置，则可以使用索引重命名表单，因此表单php/html代码如下所示：

<form id="formAddComment-' . $index . '" action="dashboard.php" enctype="multipart/form-data" method="post">

---

这样，每个表单都有自己的提交处理程序。

如果在同一页面上有多个表单，且具有相同的id，则会导致问题。特别是#formAddComment id，它附加到submit（）调用。如果有多个这样的ID，这将不起作用

jquery使用选择器。当您写入$（某物）时，某物是选择器。它可以是id、类名、变量和html元素。所以不是

$("#formAddComment").submit( function(e) {

你可以用

$(".someclassName").submit( function(e) {

就像css一样，使用#表示id。上课。只需确保使用相同的名称将class属性添加到表单中即可。你也可以试试

$("form").submit(function(e) {

---

它应该选择任何表单元素。我认为您的函数的其余部分应该可以很好地处理此更改，因为您使用的是'this'和parent（），而不是任何直接引用。

好的，dashboard.php是我的表单操作，我可以从表单中删除该操作吗？再次感谢，但我非常确定我现在没有收到ajax帖子，因为firebug显示了我发送到dashboard.php的帖子，但我希望它发送到外部脚本comment.php。是的，我认为你必须删除/更改你的动作属性Ok，去掉表单动作方法enctype属性，firebug中仍然没有任何内容，所以现在我们知道它在jquery脚本中，有什么想法吗？好的。从你发布的代码来看，我真的不知道为什么它不起作用。我的猜测是，您的函数实际上并没有使用preventDefault停止submit事件，因为它显示了一个到dashboard.php的帖子，而不是您的ajax url，并且在删除该操作后什么都没有。老实说，我总是在表单提交和链接等方面遇到问题。我通常选择按钮元素而不是提交输入。如果您需要一个非javascript选项，您可以有一个按钮和一个submit，并相应地显示相应的按钮。对不起，这就是我现在所知道的，你在顶部代码块中的“html”实际上是php和html的混合体。这不是什么大不了的事，但有点让人困惑——给出一个表单的实际生成html可能会更有用。谢谢，伙计，我在firebug中运行了你的fiddle，看到了当发出ajax请求时它应该是什么样子，但在测试时我什么都没有得到。这可能是因为页面上有多个表单实例吗？我在测试表单的第三个实例，然后我想出了一个好主意，在页面上的表单的第一个实例上测试它，并发出了ajax请求。因此，正如您可能猜到的，来自所有表单实例的所有数据都已发布。如何在jquery中仅发布所选表单中的数据？另一种选择是不使用

，而是使用

，并附加

单击（）

处理程序，而不是

提交（）

处理程序是的，#FormadComment id有多个实例，但必须有一种方法来实现这一点，使用某种.parent（）.find（）选择，还是我疯了？我以前用链接做过类似的事情，向上滑动和滑动div以显示和折叠注释。你是从

$('[id^="formAddComment"]').submit( function(e) {
    // do your ajax
});

$("#formAddComment").submit( function(e) {

$(".someclassName").submit( function(e) {

$("form").submit(function(e) {