• jQuery学习-事件之绑定事件(五)


    大家应该还记得dispatch方法中有这么一段代码:

    event = jQuery.event.fix( event ); 

    event的修复是在fix这个方法中的,而在fix中是通过 new jQuery.Event( originalEvent )来重新构建event对象的,

    同时还修复了一些属性值,请看

    fix: function( event ) {
            if ( event[ jQuery.expando ] ) {//如果event已经被修正则直接返回
                return event;
            }

            // Create a writable copy of the event object and normalize some properties
            var i, prop, copy,
                type = event.type,
                originalEvent = event,
                fixHook = this.fixHooks[ type ];
            /*
             获取需从原生event对象获取的属性值
             fixHooks中看看有没有对应事件类型的修正
             如果没有,则从mouseHooks或者是keyhooks中取,如果都没有就设置为空对象
             * 
    */
            if ( !fixHook ) {
                this.fixHooks[ type ] = fixHook =
                    rmouseEvent.test( type ) ? this.mouseHooks :
                    rkeyEvent.test( type ) ? this.keyHooks :
                    {};
            }
                    //需要复制的属性key数组
            copy = fixHook.props ? this.props.concat( fixHook.props ) : this.props;

            event = new jQuery.Event( originalEvent );//新建jQuery的event对象

            /*
             从原生event对象赋值属性到新event对象
             * 
    */
            i = copy.length;
            while ( i-- ) {
                prop = copy[ i ];
                event[ prop ] = originalEvent[ prop ];
            }

            // Support: IE<9
            // Fix target property (#1925)
            //修正event.target
            if ( !event.target ) {
                event.target = originalEvent.srcElement || document;
            }

            // Support: Chrome 23+, Safari?
            // Target should not be a text node (#504, #13143)
            /*
             如果event.target为文本节点则target指向其父节点
             * 
    */
            if ( event.target.nodeType === 3 ) {
                event.target = event.target.parentNode;
            }

            // Support: IE<9
            // For mouse/key events, metaKey==false if it's undefined (#3368, #11328)
            /*
             * 如果.metaKey == undefined 则返回false
             * 这是以一种巧妙的写法
             * !!undefined ==> false
             * !!null ==> false
             * !!"" ==> false
             * !!"a" ==> true
            
    */
            event.metaKey = !!event.metaKey;

            return fixHook.filter ? fixHook.filter( event, originalEvent ) : event;
        },
            mouseHooks: {
            props: "button buttons clientX clientY fromElement offsetX offsetY pageX pageY screenX screenY toElement".split(" "),
            filter: function( event, original ) {
                var body, eventDoc, doc,
                    button = original.button,
                    fromElement = original.fromElement;

                // Calculate pageX/Y if missing and clientX/Y available
                /*
                 修正pageX,pageY属性值
                 * 
    */
                if ( event.pageX == null && original.clientX != null ) {
                    eventDoc = event.target.ownerDocument || document;
                    doc = eventDoc.documentElement;
                    body = eventDoc.body;

                    event.pageX = original.clientX + ( doc && doc.scrollLeft || body && body.scrollLeft || 0 ) - ( doc && doc.clientLeft || body && body.clientLeft || 0 );
                    event.pageY = original.clientY + ( doc && doc.scrollTop  || body && body.scrollTop  || 0 ) - ( doc && doc.clientTop  || body && body.clientTop  || 0 );
                }
                /*
                 修正relatedTarget
                 该值为触发事件时的来源元素
                 * 
    */
                // Add relatedTarget, if necessary
                if ( !event.relatedTarget && fromElement ) {
                    event.relatedTarget = fromElement === event.target ? original.toElement : fromElement;
                }

                // Add which for click: 1 === left; 2 === middle; 3 === right
                // Note: button is not normalized, so don't use it
                /*
                 修正which属性,鼠标左键,右键,中键
                 chrome:1 === left; 2 === middle; 3 === right
                 ie没有which只有button
                         1 === left === (button == 1); 2 === middle === (button == 4); 3 === right === (button == 2)
                 * 
    */
                if ( !event.which && button !== undefined ) {
                    event.which = ( button & 1 ? 1 : ( button & 2 ? 3 : ( button & 4 ? 2 : 0 ) ) );
                }

                return event;
            }

        }, 

    今天有些焦躁,唉!

  • 相关阅读:
    .Net cache与cache更新
    用内网服务器对接微信公众号服务
    关于王者荣耀防沉迷以及各种实名认证
    【Springboot】用Springboot Admin监控你的微服务应用
    【Springboot】Springboot整合Jasypt,让配置信息安全最优雅方便的方式
    【Java库】如何使用优秀的加密库Jasypt来保护你的敏感信息?
    【Java实例】使用Thumbnailator生成缩略图(缩放、旋转、裁剪、水印)
    【MongoDB】用Docker安装一个MongoDB最新版玩玩
    【MongoDB】2019年MongoDB中文社区广州大会,干货满满的分享活动
    【Spring】Spring的定时任务注解@Scheduled原来如此简单
  • 原文地址:https://www.cnblogs.com/urols-jiang/p/4324608.html
Copyright © 2020-2023  润新知