根据ajax行为在jquery中显示消息框

时间:2013-06-28 08:56:19

标签: jquery message

我使用这个jquery代码向服务器发送请求并从服务器获取响应。这里我用这个响应数据更新一个表。这个过程非常完美。

我的问题是我需要根据脚本的行为显示一些消息。这意味着我需要在更新表时显示类似于“正在加载,请等待几秒钟”的消息。在更新表格之后,我需要显示类似“Hurray”的消息,您已成功更新用户表。'

有谁能告诉我如何使用jquery完成此操作?

这是我的代码:

$.ajax({
    type: "POST",
    url: "process.php", 
    dataType: 'html',
    data: { 
        name: $('#name').val(), 
        address: $('#address').val(), 
        city: $('#city').val() 
    },
    success:function(data){
        $('#manage_user table > tbody:last').find('tr:first').before(data);
    },
    error:function (xhr, ajaxOptions, thrownError){
        alert(thrownError);
    }, 
    complete: function(){
        //alert('update success'); 
    }
});

谢谢。

2 个答案:

答案 0 :(得分:1)

你可以这样做:

$.ajax({
    type: "POST",
    url: "process.php", 
    dataType: 'html',
    data: { 
        name: $('#name').val(), 
        address: $('#address').val(), 
        city: $('#city').val() 
    },
    beforeSend: function(){$('#loading').show();},
    success:function(data){
        $('#manage_user table > tbody:last').find('tr:first').before(data);
    },
    error:function (xhr, ajaxOptions, thrownError){
        alert(thrownError);
    }, 
    complete: function(){
        $('#loading').hide(); 
    }
});

HTML:

<img id="loading" src="loading.gif"/>

CSS:

#loading{display:none}

答案 1 :(得分:0)

您可以附加此处理程序以在触发ajax事件时启动     

$(document).ajaxStart(function() {
         $( ".message" ).text( "Loading table " );
    });
并使用已完成的处理程序允许您显示已完成的消息

<pre>$(document).ajaxComplete(function() {
   $( ".message" ).text( "Table Loaded" );
});</pre>