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>

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