Bootstrap 遮罩插件jquery.mloading

使用方法

将jquery.mloading.js和jquery.mloading.css引入到页面,调用:

$(element).mLoading({
    text:"",//加载文字,默认值:加载中...
    icon:"",//加载图标,默认值:一个小型的base64的gif图片
    html:false,//设置加载内容是否是html格式,默认值是false
    content:"",//忽略icon和text的值,直接在加载框中显示此值
    mask:true//是否显示遮罩效果,默认显示
});

方法:

$(element).mLoading("show");//显示loading组件
$(element).mLoading("hide");//隐藏loading组件

比如点击按钮,出现加载中:

js代码
<link rel="stylesheet" href="~/Content/bootstrap.css" />
<link rel="stylesheet" href="~/Content/bootstrap-loading.css"/>

<script type="text/javascript" src="~/Scripts/jquery-1.11.3.js"></script>
<script  type="text/javascript" src="src/jquery.mloading.js"></script>
<script>
    $(function(){
        $("#loadingBtnTest").click(function(){
            $("body").mLoading();
        });
    });
</script>

效果:背景会有白色蒙层,弹出“正在加载”的遮罩。

原文地址:https://www.cnblogs.com/likui-bookHouse/p/11270599.html