zoukankan      html  css  js  c++  java
  • 让Mootools的语法结构像Jquery那样

        以前一直都在用jquery,突然转到mootools,很多语法结构不太适应,不过没关系,我们可以给Mt加扩展让他的语法结构像jquery那样

    这一点在Mt上实现起来并不难,可是如果要让jquery模仿Mt是没办法的.


        Element.implement({
            //EVENTS
            bind:function(type,fn){//$('simple').bind('click mousewheel contextmenu',function(){alert('sh')}).alert('link');
                type.split(' ').each(function(event){
                    this.addEvent(event,fn);
                },this);
                return this;
            },
            fire:function(type,args,tim){//$('b').fire('click',$('a'),4000);触发$('b')的事件
                return this.fireEvent(type,args,tim);
            },
            one:function(type,fn){//$('simple').one('click',function(){alert('sh')}).alert('link');
                var removeOne=function(){this.removeEvent(type,fn).removeEvent(type,removeOne);}
                return this.addEvent(type,fn).addEvent(type,removeOne);
            },
            hover:function(fn1,fn2){//$('simple').hover(function(){console.log('1')},function(){console.log('2')});
                return this.addEvents({
                    'mouseenter':fn1,
                    'mouseleave':fn2
                });
            },
            //METHOD
            data:function(opt,value){
                return value ? this.store(opt,value):this.retrieve(opt);
            },
            //ATTRIBUTES
            attr:function(prop,value){
                switch ($type(prop)){
                    case 'object':
                        this.set(prop);
                        break;
                    case 'string':
                        if(value){
                            //Note:first attempt() arg is supposed to be index of elements array,but can't be done in Mootools
                            if($type(value)=='function') value=value.attempt(this,this);
                            this.set(prop,value)
                        }
                        else return this.get(prop);
                }
                return this;
            },
            html:function(value){
                return value ? this.set('html',value):this.get('html');
            },
            text:function(text){
                return text ? this.set('text',text):this.get('text');
            },
            val:function(value){
                //Note:Array type value not implemented
                return value ? this.set('value',value):this.get('value');
            },
            alert:function(msg){
                alert(msg);
            },
            show:function(){
                this.setStyle('display','');
            },
            hide:function(){
                this.setStyle('display','none');
            },
            _show:function(){
                this.fade('in');
            },
            _hide:function(){
                this.fade('out');
            },
            toggle:function(event,fn,fn2){
                var flag=true;
                return this.addEvent(event,function(){
                    (flag ? fn:fn2).apply(this,arguments);
                    flag=!flag;
                });
            },
            xlight:function(linkClass,opacity){
                opacity=(opacity)?opacity:.3;
                linkClass=(linkClass.charAt(0)=='.')?linkClass:'.'+linkClass;
                this.addEvent('mouseover:relay('+linkClass+')',function(e,elem){
                    $$(linkClass).each(function(link){
                        if(elem!=link){link.tween('opacity',opacity);}
                    });
                });
                this.addEvent('mouseout:relay('+linkClass+')',function(e,elem){
                    $$(linkClass).each(function(link){
                        link.tween('opacity',1);
                    });
                });
            }
        });

  • 相关阅读:
    [转]暴风电视开机卡死、闪屏怎么办
    暴风电视快速查询机器型号及平台
    暴风电视风行系统FUNOS插入U盘、移动硬盘不能写入文件。
    yum版本号前有:冒号 指的是依赖版本号,默认0不显示
    yum多个源repo安装指定版本docker
    [转]YUM的工作机制与配置
    yum!base仓库里的repo id(源标识)前有叹号
    Docker新旧版本号下载
    yum没有可用软件包 docker。错误:无须任何处理CentOS-Media.repo仓库
    【笔记整理】之 servlet
  • 原文地址:https://www.cnblogs.com/see7di/p/2239648.html
Copyright © 2011-2022 走看看