Question

为什么以下不接受表格？它所做的只是做一个普通的PHP帖子而不会抛出任何错误......

我也在使用blockUi，因此阻塞/解锁。

$(document).ready(function(){
    $("input.update").click(function(){
        var str = $(this).parent().serialize();
        $(this).parent().parent().block({ message: "<span class=\"loading\"><img src=\"<?php echo $siteUrl ?>/admin/template/images/loading.gif\" alt=\"loading...\" /><p>Updating...</p></span>" });
        $.ajax({
            type: "POST",
            url: "forms/update.php",
            data: str,
            success: function(){
                $("div.edit_box").unblock();
                $("div.edit_box").append("<span class=\"success\">This has been updated!</span>");
            }
        });
        return false;
    });
});

这是我第一次尝试使用jQuery的Ajax功能，所以请耐心等待。

Answer 1

("input.update").click(function(){

应该是

$("input.update").click(function(){

Answer 2

由于您似乎只使用了帖子的“成功”回调，因此可以使用.post方法，这在眼睛上更容易一些。您也可以将这些阻止调用放在ajaxStart和ajaxStop中。对我来说它更整洁。

$(this).parent().parent().block似乎对我不对，我将其更改为引用用于解除阻止的相同元素。我还要检查PHP脚本的输出，以确保实际的“更新”内容已经更新（只需从PHP回显XML，您将在控制台日志中看到它）

$(function() {
    // Apply click handlers to anchors
    $("input.update").click(function(e){
        // Stop normal link click
        e.preventDefault();

        var str = $(this).parent().serialize();

        // Send request
        var action = "forms/update.php";
        $.post(action, {data:str}, function(xml) {
            console.log(xml);
            $("div.edit_box").append("<span class=\"success\">This has been updated!</span>");

        })
    });

    // Adds a wait indicator to any Ajax requests
    $(document.body).ajaxStart(function() {
        $("div.edit_box").block({ message: "<span class=\"loading\"><img src=\"<?php echo $siteUrl ?>/admin/template/images/loading.gif\" alt=\"loading...\" /><p>Updating...</p></span>" });

    }).ajaxStop(function() {
        $("div.edit_box").unblock();
        $("div.edit_box").append("<span class=\"success\">This has been updated!</span>");
    });
});

jQuery Ajax提交问题

2 个答案: