js 数据加载loading封装

<!-- 模态框(Modal) -->
<div class="modal fade" id="qst_loading" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="z-index: 9999">
    <div class="modal-dialog">
        <div class="modal-content" style="width: 0px; text-align: center">
            <div class="modal-body" >
            </div>
        </div><!-- /.modal-content -->
        {{ image("static/background/image/loading.gif", "alt":"loading", "style":"max-width: 200px; margin:200px 100px 100px 200px") }}
    </div><!-- /.modal-dialog -->
</div>
<!-- /.modal -->
/*
* 1、这个封装外层包裹自执行函数,只要引入此文件,js 就会自动执行
* 2、if('undefined' == typeof QstLoading) 首先判断QstLoading函数名有没有被使用,避免覆盖其他方法
* 3、定义一个匿名函数,使用new构造函数,意思是创建一个新的对象QstLoading ,并分配一个新地址,改变this指向,指向QstLoading ,(this )
* 4、为新对象添加属性show和hide
* 5、QstLoading 没有声明,成为全局对象(不建议此种方法成为全局)
*/



/*
* 1、这个封装外层包裹自执行函数,只要引入此文件,js 就会自动执行
* 2、if('undefined' == typeof QstLoading) 首先判断QstLoading函数名有没有被使用,避免覆盖其他方法
* 3、定义一个匿名函数,使用new构造函数,意思是创建一个新的对象QstLoading ,并分配一个新地址,改变this指向,指向QstLoading ,(this )
* 4、为新对象添加属性show和hide
* 5、QstLoading 没有声明,成为全局对象(不建议此种方法成为全局)
*/
$(function() {
        if('undefined' == typeof QstLoading){
            QstLoading = new function () {
                var _modal = $('#qst_loading');
                $(_modal).modal({
                    keyboard: false,
                    backdrop: 'static',
                    show: false
                });
                this.show = function () {
                    $(_modal).modal("show");
                };
                this.hide = function () {
                    $(_modal).modal('hide');
                }
            }();
        }
    });

猜你喜欢

转载自www.cnblogs.com/nana-share/p/8855668.html