您现在的位置是：影视综艺

js 有没有办法判断一个dom元素是否已经绑定了某个事件,js 判断是否存有事件 addeventlistener

2020-10-14 06:17影视综艺

简介addEventListener()绑定事件的对象方addEventListener()含有三个参数，件名称，另一个是事件执行的函数，最后一个是事件捕获，，obj.addEventListener(" js 有没有办法判断一个dom元素是否已经绑定了某个事件...

addEventListener()绑定事件的对象方

addEventListener()含有三个参数，件名称，另一个是事件执行的函数，最后一个是事件捕获，，

obj.addEventListener("click",function(){},true/false);

这里的事件名称跟直接写的事件名称不一样，在这里前面没有on,

还有就是按以往的方法定义事件的话后面的会覆盖掉前面的事件函数，

但是按这种方式写的话几个事件函数都会执行，

最后是true和false的解释，，事件在执行时都会有俩个流，一个是捕获事件流，另一个是冒泡事件流，进来的事件是捕获事件，出去的事件是冒泡事件，true的话会捕获进来时的，false的话会捕获出去时的，，

下面是更多关于addeventlistener的问答

原生实现判断是否有事件。如果确实需参照代码，另外本代码只使用于调用dom2加载或者移除事件功能，对应dom0类型的没有做测试。

以下代码修改了原生的Element对象，是否需要这样做，请自己酌情处理。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /**
         * 此处代码必须放到任何javascript代码之前。另外增加事件只能用addEventListener形式。
         */
        (function() {
            Element.prototype.eventListenerList = {};
            Element.prototype._addEventListener = Element.prototype.addEventListener;
            Element.prototype._removeEventListener = Element.prototype.removeEventListener;
            Element.prototype.addEventListener = function(a,b,c) {
                this._addEventListener(a,b,c);
                if(!this.eventListenerList[a]) this.eventListenerList[a] = [];
                this.eventListenerList[a].push(b);
            };
            Element.prototype.removeEventListener = function(a,b,c){
                this._removeEventListener(a, b,c);
                if(this.eventListenerList[a]){
                    var arr = this.eventListenerList[a];
                    for(var i =0;i<arr.length;i++){
                        if(arr[i].toString() === b.toString()){
                            this.eventListenerList[a].splice(i,1);
                        }
                    }
                }
            }
        })();
        //此后为测试代码。
        window.onload = function(){
            var dom = document.getElementById("test");
            //增加三个监听
            dom.addEventListener("click",function(){
                console.info("click function");
            },false);
            dom.addEventListener("click",function(){
                console.info("click function2");
            },false);
            dom.addEventListener("click",function(){
                console.info("click function3");
            },false);
 
            console.log(dom.eventListenerList["click"].length);
            //读出监听的方法
            var clicks = dom.eventListenerList.click;
            if(clicks) clicks.forEach(function(f) {
                console.log("I listen to this function: "+f.toString());
            });
            //删除监听
            dom.removeEventListener("click",function(){
                console.info("click function");
            },false);
             
            console.log(dom.eventListenerList["click"].length);
        };
    </script>
</head>
<body>
    <button id="test" >测试</button>
</body>
</html>