easyui添加加载中遮罩层

最近项目中需要用到Ajax与后台传递数据，后代在处理请求时时间有过长，为了用户体验好一点，就用到了EasyUI弹出加载中的遮罩的两种方法。

第一种：

$.ajax({
    type: 'POST',
    url: url,
    data: obj,
    dataType: 'json',
    beforeSend: function () {
        load();
    },
    complete: function () {
        disLoad();
    },
    success: function (data) {
        showMessage(data);
    }
});

//弹出加载层
function load() {
    $("<div class=\"datagrid-mask\"></div>").css({
        display: "block",
        width: "100%",
        height: $(window).height()
    }).appendTo("body");
    $("<div class=\"datagrid-mask-msg\"></div>").html("加载中，请稍候。。。").appendTo("body").css({
        display: "block",
        left: ($(document.body).outerWidth(true) - 190) / 2,
        top: ($(window).height() - 45) / 2
    });
}
//取消加载层  
function disLoad() {
    $(".datagrid-mask").remove();
    $(".datagrid-mask-msg").remove();
}   

第二种：

$.ajax({
    type: 'POST',
    url: url,
    data: obj,
    dataType: 'json',
    beforeSend: function () {
        $.messager.progress({
            title: '提示',
            msg: '文件上传中，请稍候……',
            text: ''
        });
    },
    complete: function () {
        $.messager.progress('close');
    },
    success: function (data) {
        $("#uploadHtmlUrl").val(data.fileUrl);
        $("#uploadHtml").attr("src", data.fileUrl);
    }
});

我在项目中用的第一种，觉得还不错。效果如下：