zoukankan      html  css  js  c++  java
  • JS—事件对象

    事件对象

      在触发DOM事件的时候都会产生一个对象

    事件对象Event:
      1)type:获取事件类型
      2)target:获取事件目标
      3)stopPropagation():阻止事件冒泡
      4)preventDefault():阻止事件默认行为

        <div id="div">
            <button id="btn">按钮</button>
            <a href="www.baidu.com" id="aid">百度</a>
        </div>
        <script>
            document.getElementById("btn").addEventListener("click", show);
            //只需要button事件,但是包含button的div也执行了,发生了事件冒泡
            document.getElementById("div").addEventListener("click", show1);
            document.getElementById("aid").addEventListener("click",show2);
            function show(event) {
                //alert(event.type);//click
                alert(event.target);//[object HTMLButtonElement]
                event.stopPropagation();//阻止事件冒泡
            }
            function show1() {
                alert("Here is div");
            }
            function show2(event) {
                event.preventDefault();//阻止超链接默认的跳转行为
                event.stopPropagation();//阻止事件冒泡,否则show1()会再次执行
            }
        </script>
  • 相关阅读:
    64_q2
    64_q1
    64_p10
    64_p9
    64_p8
    64_p7
    64_p6
    64_p5
    64_p4
    64_p3
  • 原文地址:https://www.cnblogs.com/feile/p/5449646.html
Copyright © 2011-2022 走看看