javaScript事件处理兼容IE8及以下版本写法

最新推荐文章于 2021-02-01 00:29:44 发布

熙街丶一人

最新推荐文章于 2021-02-01 00:29:44 发布

阅读量354

点赞数

分类专栏： javaScript 文章标签： javascript

本文链接：https://blog.csdn.net/qq_38650613/article/details/107849927

版权

javaScript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

1.javaScript事件处理兼容IE8及以下版本写法

<!DOCTYPE html>

<html>


<head lang="en">

    <meta charset="UTF-8">

    <title>event</title>

</head>


<body>

    <input type="button" value="点击我" id="btn">

    <script type="text/javascript">

        //绑定事件分为2种不同的写法

        //1.chrome firefox  IE9及以上版本

        //2.IE8及以下版本

        var eventUtil = {

            /*绑定事件          

                element:元素

                e_type:事件类型

                e_fnt:事件方法

            */

            addEvent: function(element, e_type, e_fnt) {

                if (element.addEventListener)

                    element.addEventListener(e_type, e_fnt);

                else if (element.attachEvent)

                    element.attachEvent("on" + e_type, e_fnt);

                else

                    element["on" + e_type] = e_fnt;

            },

            /*解绑事件：注意'e_fnt'不能为匿名函数

                element:元素

                e_type:事件类型

                e_fnt:事件方法

            */

            removeEvent: function(element, e_type, e_fnt) {

                if (element.removeEventListener)

                    element.removeEventListener(e_type, e_fnt);

                else if (element.detachEvent)

                    element.detachEvent("on" + e_type, e_fnt);

                else

                    element["on" + e_type] = e_fnt;

            },

            /*获得事件源*/

            getTarget: function(event) {

                return event.target || event.srcElement;

            },

            /*阻止默认事件*/

            preventDefault: function(event) {

                if (event.preventDefault)

                    event.preventDefault();

                else

                    event.returnValue = false;

            },

            /*阻止冒泡事件*/

            stopPropagation: function(event) {

                if (event.stopPropagation) {

                    event.stopPropagation()

                } else {

                    event.cancelBubble = true;

                }

            }

        }


        function testFnt(event) {

            console.log(typeof event.preventDefault);

            console.log("我被点击了")

            console.log(eventUtil.getTarget(event));


        }

        var btn = document.getElementById("btn");

        eventUtil.addEvent(btn, "click", testFnt);

        //eventUtil.removeEvent(btn, "click", testFnt);

    </script>

</body>


</html>