zoukankan      html  css  js  c++  java
  • 【写一个自己的js库】 4.完善跨浏览器事件操作

    1.阻止冒泡。

    function stopPropagation(event){
            event = event || getEvent(event);
            if(event.stopPropagation){
                event.stopPropagation();
            }else{
                event.cancelBubble = true;
            }
        }
        Lily['event'] = stopPropagation;

    2.阻止事件默认动作。

    function preventDefault(event){
            event = event || getEvent(event);
            if(event.preventDefault){
                event.preventDefault();
            }else{
                event.returnValue = false;
            }
        }
        Lily['preventDefault'] = preventDefault;

    3.在文档加载完时执行函数,不用等待图片都加载完。

    function addLoadEvent(loadEvent, waitForImages){
            if(!isCompatible()) return false;
            if(waitForImages){
                addEvent(window, 'load', loadEvent);
            }
    
            var init = function (){
                if(arguments.callee.done) return;
                arguments.callee.done = true;
    
                loadEvent.apply(document, arguments);
            };
    
            if(document.addEventListener){
                document.addEventListener("DomContentLoaded", init, false);
            }
    
            if(/WebKit/i.test(navigator.userAgent)){
                var timer = setInterval(function (){
                    if(/complete|loaded/.test(document.readyState)){
                        clearInteval(timer);
                        init();
                    }
                }, 10);
            }
    
            /*@cc_on @*/
            /*@if (@_win32)
            document.write("<src id=__ie_loaded defer src=//:></script>");
            var script = document.getElementById("__ie_loaded");
            script.onreadystatechange = function (){
                if(this.readyState == "complete"){
                    this.onreadystatechange = null;
                    init();
                }
            };
            /*@end @*/
    
            return true;
        }
        Lily['addLoadEvent'] = addLoadEvent;

    4.取得target对象。

    function getTarget(event){
            event = event || getEvent(event);
            var target = event.target || event.srcElement;
    
            if(target.nodeType == Lily.node.TEXT_NODE){
                target = target.parentNode;
            }
    
            return target;
        }
        Lily['getTarget'] = getTarget;

    5.判断鼠标哪个键被按下。

    function getMouseButton(event){
            event = event || getEvent(event);
            var buttons = {
                'left' : false,
                'middle' : false,
                'right' : false
            };
    
            if(event.toString && event.toString().indexOf('MouseEvent') != -1){
                switch(event.button){
                    case 0:
                        buttons.left = true;
                        break;
                    case 1:
                        buttons.middle = true;
                        break;
                    case 2:
                        buttons.right = true;
                        break;
                    default:
                        break;
                }
            }else if(event.button){
                switch(event.button){
                    case 1:
                        buttons.left = true;
                        break;
                    case 2:
                        buttons.right = true;
                        break;
                    case 3:
                        buttons.left = true;
                        buttons.right = true;
                        break;
                    case 4:
                        buttons.middle = true;
                        break;
                    case 5:
                        buttons.left = true;
                        buttons.middle = true;
                        break;
                    case 6:
                        buttons.middle = true;
                        buttons.right = true;
                        break;
                    case 7:
                        buttons.left = true;
                        buttons.middle = true;
                        buttons.right = true;
                        break;
                    default:
                        break;
    
                }
            }else{
                return false;
            }
    
            return buttons;
        }
        Lily['getMouseButton'] = getMouseButton;
    View Code

    6.获取鼠标在文档中的位置。

    function getPositionInDocument(event){
            event = event || getEvent(event);
            var x = event.pageX || 
                    (event.clientX + document.documentElement.scrollLeft) || 
                    (event.clientX + document.body.scrollLeft);
            var y = event.pageY || 
                    (event.clientY + document.documentElement.scrollTop) ||
                    (event.clientY + document.body.scrollTop);
    
            return {'x' : x, 'y' : y};
        }
        Lily['getPositionInDocument'] = getPositionInDocument;

    7.获取按键的值。

    function getKeyPressed(event){
            event = event || getEvent(event);
            var code = event.keyCode;
            var value = String.fromCharCode(code);
    
            return {'code': code, 'value': value};
        }
        Lily['getKeyPressed'] = getKeyPressed;
  • 相关阅读:
    期末考试冬眠
    题解 P1457 【城堡 The Castle】
    题解 P1052 【过河】
    题解 P5663 【加工零件【民间数据】】
    与 macOS 10.12 兼容的OpenCV版本
    summarise() regrouping output 警告
    binary_crossentropy和BinaryCrossentropy的区别
    损失函数BinaryCrossentropy例子说明
    理解功能强大的sed替换命令
    理解GAN对抗神经网络的损失函数和训练过程
  • 原文地址:https://www.cnblogs.com/pandabunny/p/4771965.html
Copyright © 2011-2022 走看看