js ajax 添加遮盖层

JS代码

<script src="/static/js/cvi_busy_lib.js"></script>

<script type="text/javascript">

//方法默认是，给body添加一个div，然后整个body都是遮罩层。
//getBusyOverlay需要3个参数
//参数一：viewport为创建遮罩层的div，
//参数二：color:'white',               背景色
//       opacity:0.75,                透明度：从 0.0 （完全透明）到 1.0（完全不透明）
//       text:'viewport: loading...', 默认显示的提示文字，这里是viewport: loading...
//       style:'text-shadow: 0 0 3px black;font-weight:bold;font-size:16px;color:white' 字体样式
//参数三：color:'#ff0',   进度圈颜色
//       size:100,       进度圈大小
//       type:'o'        有5种类型，c，o，p，t，以及默认类型，具体请看js内部方法getBusyVL。
var xval = getBusyOverlay('viewport', { color: 'white', opacity: 0.75, text: 'viewport: loading...', style: 'text-shadow: 0 0 3px black;font-weight:bold;font-size:16px;color:white' }, { color: '#ff0', size: 100, type: 'o' });
$.ajax({
    url: "/Home/Index",
    type: "POST",
    dataType: "json",
    beforeSend: function() {
        if (xval) {
            xval.settext("正在登录，请稍后......");//此处可以修改默认文字，此处不写的话，就按照默认文字来。
        }
    },
    data: { id: id },
    success: function(data) {
        xval.remove(); //此处是移除遮罩层
    }, error: function() {
        xval.remove(); //此处是移除遮罩层
    }
});

需要用到js插件：

cvi_busy_lib.js

下载地址：https://download.csdn.net/download/qq_25391785/10296944

文件来源：https://www.cnblogs.com/cang12138/p/8033525.html#_label0