javascript - 这种js写法用了什么语法或框架?

查看:86
本文介绍了javascript - 这种js写法用了什么语法或框架?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

全部依赖jQuery库
$符号用M替换

/** 

 * @import common/fx.common.js 
 *
 * @id                             string              (可选)对象id                                        默认 null
 * @drag                           boolean             (可选)是否允许拖拽                                     默认 true
 * @html                          string              (可选)内容                                           默认 null 
 * @title                          string              (可选)标题,支持html标签                                默认 系统提示
 * @position                       string              (必须)定位方式                                          默认 fixed ⇒ fixed/absolute
 * @status                      boolean             (可选)icon状态                                       默认 null
 * @is_close_button                boolean             (可选)是否允许关闭按钮                                 默认 true
 * @time                           number              (可选)自动消失时间                                     默认 null
 * @data                          object              (可选)ajax请求参数                                 默认null 
 * @url                            string              (可选)Ajax请求地址                                 默认null
 * --@button                        object                
 * --''href''                         string              (可选)按钮链接                                        默认 null    
 * --''html''                         string              (可选)按钮文字,支持html标签                            默认 '关闭'  
 * --''callback''                   function              (可选)点击回调                                
 * @close                       function            (可选)关闭之后回调
 */
;(function(M,window){
    M.ui.define('confirm',function(){
        function Confirm(ops,args){
            this.ops=ops;
            this.init(args);
        };
        Confirm.prototype={
            constructor:Confirm,
            init:function(args){
                this.creat(args);
                return this;
            },
            creat:function(args){
                this.innerHeight=M(window).height();
                this.scrollTop=/absolute/g.test(this.ops.position)?M(window).scrollTop():0;
                this.container=M(M.creatlabel(),{
                    'class':'mt-master-container mt-confirm-master',
                    id:this.ops.id||'mt-confirm-'+M.now(),
                    css:{
                        opacity:0,
                        position:'absolute',
                        height:M(document).height(),
                        zIndex:M.now()
                    }    
                });
                this.content=M(M.creatlabel(),{
                    'class':'mt-master-content mt-confirm-container',
                    css:{
                        position:this.ops.position    
                    },
                    html:this.renderIcon()
                });
                if(M.isString(this.ops.title)){
                    this.title=this.renderTitle();
                    this.content.append(this.title);
                    if(this.ops.drag){
                        M.ui.drag.init({target:this.title,container:this.content});
                    };
                };
                this.body=this.renderBody();
                this.button=this.renderButton(args);
                this.content.append(this.body);
                this.content.append(this.button);
                M(document.body).append(this.container.append(this.content));
                this.resolve(args);
            },
            resolve:function(args){
                var that=this,width=Math.max(300,this.content.width()),height=this.content.outerHeight(true);
                this.container.fadeTo(300,1);
                this.content.css({
                    left:'50%',
                    opacity:0,
                    marginLeft:-0.5*(width+100),
                    width:width,
                    top:(this.innerHeight-height)*0.5+this.scrollTop,
                    marginTop:-30
                }).animate({marginTop:0,opacity:1},300,function(){
                    delete that.body;
                    delete that.scrollTop;
                    delete that.innerHeight;
                    delete that.button;
                    delete that.title;
                    that.dismiss(args);        
                });    
            },
            dismiss:function(args){
                M.isNumeric(this.ops.time)&&M.delay(this.ops.time,function(){
                    this.remove(this,this.ops.button[this.ops.button.length-1].callback,args);    
                },this);
            },
            remove:function(that,fn,args){
                this.content.animate({top:this.content.position().top+30,opacity:0},300,function(){
                    that.container.remove();
                    M.isFunction(fn)&&fn.apply(that,args||[]);
                    that.destroy(that);
                });    
                that.container.fadeOut(300);
            },
            submit:function(e){
                var that=e.data.context,args=e.data.args,type=e.data.type,callback=e.data.callback;
                switch(type){
                    case  0 : 
                        if(that.ops.url==null){
                            that.ops.auto?that.remove(that,callback,args):M.isFunction(callback)&&callback.apply(that,args||[]);
                        }else{
                            M.ui.ajax.init({
                                url:that.ops.url,
                                data:that.ops.param,
                                isload:false,
                                beforeSend:function(){
                                    that.waiting=M.ui.waiting.creat({warp:that.content,hide:false});    
                                },
                                success:function(data){
                                    M.delay(1,function(){
                                        delete that.waiting;
                                        that.remove(that,callback,[data].concat(args));
                                    });
                                },
                                error:function(msg){
                                    M.delay(300,function(){
                                        that.waiting.cancel();
                                        delete that.waiting;
                                        M.ui.waiting.creat({status:false,warp:that.content,text:msg,time:500});    
                                    });
                                }
                            },this);
                        };
                        break ;    
                    case  1 : 
                        that.remove(that,callback,args);
                        break ;    
                    default : break ;    
                };    
            },
            renderBody:function(){
                return M(M.creatlabel(),{
                    'class':'mt-confirm-content',
                    html:this.ops.html
                });    
            },
            renderIcon:function(){
                return M.renderHTML({
                    name:'em',
                    proto:{
                        'class':'iconfont mt-confirm-icon'
                    },
                    html:this.ops.icon
                });    
            },
            renderButton:function(args){
                var o=M(M.creatlabel(),{
                    'class':'mt-confirm-button'
                });
                for(var color=['blue','white'],list=[],i=0;i<this.ops.button.length;i++){
                    M(M.creatlabel('a'),{
                        'class':color[i]+' mt-confirm-sure-button',
                        href:this.ops.button[i].href||'javascript:;',
                        html:this.ops.button[i].html
                    }).bind('click',{context:this,callback:this.ops.button[i].callback,type:i,args:args},this.submit).appendTo(o);
                };
                return o;
            },
            renderTitle:function(){
                return M(M.creatlabel(),{
                    'class':'mt-confirm-title',
                    html:this.ops.title
                });
            },
            destroy:function(that){
                delete that;    
            }    
        };
        return {
            defaults:{
                id:null,
                drag:true,
                title:'系统提示',
                position:'fixed',
                html:'请输入您的提示文字内容',
                icon:M.Font.error_fill_triangle,
                time:null,
                param:null,
                url:null, 
                auto:true,
                button:[
                    {
                        href:null,
                        html:'确认',
                        callback:function(){}
                    },
                    {
                        href:null,
                        html:'关闭',
                        callback:function(){}
                    }
                ]
            },    
            init:function(ops){
                return new Confirm(M.extend(true,{},this.defaults,ops),[].slice.call(arguments,1));
            }
        };
    });
})(window.jQuery||window.Zepto||window.xQuery,window);

解决方案

M是自定义的变量, 这是一个立即执行函数, 执行的时候传入的第一个参数赋值给M..所以这个的M是(window.jQuery||window.Zepto||window.xQuery)这个表达式的值..从左往右, 如果全局变量有这个变量的话就赋值给M

这篇关于javascript - 这种js写法用了什么语法或框架?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆