执行Web方法时页面挂起

Question

我正在使用ajax-webmethod（使用json）将数据保存在数据库中并在需要时选择它。现在每当我调用webmethod时，在处理方法时整个页面都会挂起，并且页面无法完成任何操作。

我希望在从ajax调用web方法时启用所有内容，例如在Web方法完成之前显示加载图像。

我的代码如下：

function getvalues(id, tab, pageNo) {
    $.ajax({
        type: "POST",
        url: "default.aspx/LoadData",
        data: "{'id':'" + id + "','tab':'" + tab + "','pageNo':'" + pageNo + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            if (msg.d.length > 0) {
                var dvComment = document.getElementById("Comments");
                dvComment.innerHTML += msg.d;
            }  
        },
        async: true,
        error: function(xhr, status, error) {
            // alert(xhr.statusText);
        }
    });
}

所以现在当它将页面挂起时将html呈现到DIV中。

Answer 1

要显示加载图片，您可以使用ajaxStart方法，如下所示：

$("#loading").ajaxStart(function(){
    $(this).show();
});

#loading的位置：

<img id="loading" src="images/ajaxload.gif" alt="loading..." style="display:none"/>

隐藏加载图片：

$("#loading").ajaxComplete(function(){
   $(this).hide();
});