Jquery 使用AJAX提交表单

我正在使用Ajax和JQUERY提交表单。由于某些原因，我似乎无法运行AJAX。表单位于fancybox 2模式中，因此我认为这可能与此有关，但我无法理解。对于在fancybox模式中进行AJAX调用，我需要做些什么

我的代码：collection\u create\u输入为TRUE

$(".edit-post").submit(function(e) {

    var dataString = $(this).serialize();


if (collection_create_input == "true") {
    $.ajax({  
        type: "POST",  
        url: "checkcollection.php",  
        data: dataString,
        async: false,
        success: function(data) {
          $(this).parent(".modal-content").find("#field1secondary").show();
        }
    });
}

        e.preventDefault();

    });

---

注意：

您是否确保还包括jQuery库

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

---

如果以这种方式使用ajax，则必须包含它，否则它将无法运行。

这里首先要注意的是

发送ajax请求时，

collection\u create\u input

是否为真

因为如果它为false，它将不会执行。ajax请求不会按照您希望的方式发送

您应该担心的第二件事是

serialize（）

方法的使用

您应该尝试的是：

$(this).serialize();

---

正如文档中所述：

html表单是什么样子的？是打开对话框时生成的fancybox对话框的内容，或是显示的隐藏div。我经常在fancybox 2对话框中使用表单

您可能希望尝试使用jquery on事件并绑定到目标。这将绑定到正文，但请注意具有class.edit post的表单中发生的任何提交事件。这样，您可以随时加载表单，表单仍将被处理

$("body").on("submit", ".edit-post", function(e) {

    var dataString = $this.serialize();


if (collection_create_input == "true") {
    $.ajax({  
        type: "POST",  
        url: "checkcollection.php",  
        data: dataString,
        async: false,
        success: function(data) {
          $(this).parent(".modal-content").find("#field1secondary").show();
        }
    });
}

        e.preventDefault();

    });

---

我建议使用jquery表单插件

---

虽然这也可以通过iframes实现，但这个插件更好。

在浏览器控制台中，检查XHR请求和响应。这将有助于调试问题。如果没有回应。确保jquery正在为此函数工作，并且没有冲突。此外，请尝试警报（“工作”）；在每个代码行之后。这将帮助您找到损坏的零件。

尝试

返回false

，如下所示。您还可以用HTML标记更新您的问题吗

$(".edit-post").submit(function(e) {
    var dataString = $(this).serialize();
    if (collection_create_input == "true") {
    $.ajax({  
        type: "POST",  
        url: "checkcollection.php",  
        data: dataString,
        async: false,
        success: function(data) {
          $(this).parent(".modal-content").find("#field1secondary").show();
        }
    });
    return false;
    }
});

检查或获取参考和代码样本