Question

我有以下javascript，它将数据传递到我的数据库，然后返回成功消息。

在成功的那一刻，按钮会淡出并完全隐藏，但成功信息不会显示。

$(document).ready(function () {
    $('form.user_status').submit(function () {
        var userna = $(this).find("[name='userna']").val();
        var joborder_id = $(this).find("[name='joborder_id']").val();
        var user_email = $(this).find("[name='user_email']").val();
        var app_status = $(this).find("[name='app_status']").val();
        // ...
        $.ajax({
            type: "POST",
            url: "user_status.php",
            data: {
                userna: userna,
                joborder_id: joborder_id,
                user_email: user_email,
                app_status: app_status
            },
            success: function () {
                $('form.user_status').hide(function () {
                    $('div.success').fadeOut();
                });
                success = 'Status changed';
            }
        });
        return false;
    });
});

应该显示成功消息的html

<div class="success" style="display: none;"></div>

Answer 1

您实际上并没有对成功字符串做任何事情。

为什么不去：

success: function(data){
    $('form.user_status').hide();
    $('div.success').html('Status changed').delay(1000).fadeOut();
}

<强>除非你的成功div在你的形式里面。如果是这样，那么你的div将立即随表格消失。哪个有点傻。注意我添加了数据 - 您需要传递您返回的内容（或者如果您愿意，您将如何使用数据？）

默认情况下，无显示意味着你的div是不可见的。 fadeout肯定会让它看不见吗？

编辑：所以我删除了一堆东西。如果你只是想改变div中的内容，那就让它消失。你插入html然后fadeout它会为你照顾它。

JSFiddle

延迟是让用户第二次阅读它。

Answer 2

在jQuery中，ajax方法在ajax响应成功时调用了成功方法。由于ajax是异步的，在执行$ .ajax之后，编译光标移动到下一行。无论你在成功方法中编写什么代码，都会在ajax成功后立即执行。你需要在成功方法中改变DOM，而不是变量。

显示Ajax成功的消息

2 个答案: