js addEventListener

            window.onload = function () {
                var lis = document.getElementById("list").getElementsByTagName("li");
                for (var i = 0; i < lis.length; i++) {
                    lis[i].addEventListener('click', li_click, false);
                }
            }
            function li_click()
            {
                var that = this;
                console.log(that);
                var span = that.getElementsByTagName("span")[0];
                console.log(span.innerText);
            }

 

 <script>
        var user = document.getElementById("user");
        var pwd = document.getElementById("pwd");
        //focus 获得焦点
        user.addEventListener("blur", function () {
            //check_length(user); //传递参数
            check_length.call(user); //把该函数的this 更改为user

        }, false);
        pwd.addEventListener("blur", function () {
            check_length(pwd);
        }, false);

        function check_length(obj) {
            var that = obj;
            var that1 =this;
            if (that.value.length < 1) {
                alert("");
            }
            console.log("user||pwd");
        }


    </script>

 

//事件捕获 与冒泡

        var dds = ul.getElementsByTagName("dd");
/*         for (var i = 0; i < dds.length; i++) {
            dds[i].addEventListener("click", function () {
                //check(dds[i]); //传递参数 为未定义
                check(this); //传递参数
            }, true);
        }
        function check(obj)
        {
            var taht = obj;
            console.log(taht);
        } */
        for (var i = 0; i < dds.length; i++) {
            dds[i].addEventListener("click", check, true);
        }
        function check(e)
        {
            var taht = e.target;
            console.log(taht);
        }

第三个参数默认值是false,表示在事件冒泡阶段调用事件处理函数;如果参数为true,则表示在事件捕获阶段调用处理函数。

详细  转自 :   https://segmentfault.com/a/1190000005654451

JS addEventListener多次绑定同一事件,触发多次

 

 
 //绑定删除文件
    function bind_delfile()
    {
        var file_dels = document.getElementsByClassName("file_del");

        for (var i = 0; i < file_dels.length; i++) {

            file_dels[i].addEventListener("click", del_file, true);
        }
        function del_file(e) {
            var that = e.target;
            that = that.parentNode.parentNode;
            var md5 = that.getAttribute("md5"); 
            //检测对象是否相等
            for (var j = 0; j < u_files.length; j++) {
                if (u_files[j].filemd5 == md5) {
                    u_files.splice(j, 1);
                    break;
                }
            }
            //此处多次绑定后 会触发 2次事件
            that.parentNode && that.parentNode.removeChild(that);
        }

    }

 


addEventListener 多重监听问题


http://tianfangye.com/2014/02/17/multiple-event-listeners/
posted @ 2019-09-06 10:36  enych  阅读(1167)  评论(0编辑  收藏  举报