• JavaScript获取事件对象和目标对象


    在JavaScript开发中,经常需要获取触发某个事件的目标对象。让后根据目标对象进行不同的业务处理。下面展示通过JavaScript获取触发事件的事件目标对象。如下:

    Js代码  

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    window.onload = function(){  
      var obj = document.getElementById("test");  
       
      obj.onclick = function(event){  
        // W3C的event对象直接通过函数参数传递过来(arguments[0])  
        // IE的event对象绑定到window对象上面  
        var evt = event || window.event;  
        alert(evt);   
      };  
    };

     HTML代码  

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    <html>  
      <head>  
        <title>get target</title>  
        <script type='text/javascript'>  
           window.onload = function(){  
             var obj = document.getElementById("test");  
       
             obj.onclick = function(event) {  
                // 获取事件对象  
                var evt = event || window.event;  
       
                // 获取事件触发的目标对象  
                // W3C标准(非IE): evt.target  
                // IE:evt.srcElement  
                var src = evt.target || evt.srcElement;  
                     
                // 当点击div(非h3)标签上显示DIV,点击h3标签上显示H3  
                alert(src.tagName);   
             };  
           };  
        </script>  
      </head>  
      <body>  
        <div style='height: 200px;  200px; background-color: green; padding: 30px;' id="test">  
          <h3 style='background-color: red;'>点击我......</h3>  
        </div>  
       <body>  
    </html>
  • 相关阅读:
    转MySQL详解--索引
    [转]关于MYSQL Innodb 锁行还是锁表
    根据STATUS信息对MySQL进行优化
    源码编译安装 MySQL 5.5.x 实践
    thrift服务端到客户端开发简单示例
    thrift安装
    thrift 调取 python php go 客户端代码
    Linux系统启动级别及顺序
    Linux手动释放内存
    /etc/passwd&/etc/shadow文件分析
  • 原文地址:https://www.cnblogs.com/zhwl/p/4539814.html
Copyright © 2020-2023  润新知