zoukankan      html  css  js  c++  java
  • event.target与event.srcElement

      target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。

      在标准浏览器下我们一般使用event.target就能解决,然而低版本IE浏览器总是会出些幺蛾子,这时候就得使用event.srcElement。

      这时候就得有一个兼容性的写法了。

      1、使用三元运算符  

    var Target = event.target ? event.target : event.srcElement
    

      

      2、使用if语句来判断

    if(event.target){ // IE10及以下版本浏览器不能识别
        // do something...
    }else if(event.srcElement){   // IE10及以下版本会执行该代码
        // do something...
    }
    

      

      例如:现在要为一个按钮添加一个监听事件,当点击该按钮时就触发事件,这时候可以这样写:

    <button id="btn">按钮</button>
    <script>
    	// tagName返回的标签名默认都是大写的,可使用toLowerCase将其转换为小写
    	var btn = document.getElementById('btn');
    
    	if(btn.attachEvent){ // IE8及以下版本写法
    		btn.attachEvent('onclick',function(ev){ // Firefox下必须给函数传一个参数,一般会传event或ev,否则会报错,其他浏览器可不传,为了兼容性,所以给函数传参以防出错。
    		        var Target = ev.target ? ev.target : ev.srcElement;
    			console.log(ev.type); // 事件类型
    			console.log(Target.tagName) // 触发该事件的标签名,为大写,不同的浏览器可能会返回不同的结果
    		})
    	}else if(btn.addEventListener){  // IE8及以下版本不支持
    		btn.addEventListener('click',function(ev){ // Firefox下必须给函数传一个参数,一般会传event或ev,否则会报错,其他浏览器可不传,为了兼容性,所以给函数传参以防出错。
    			var Target = ev.target ? ev.target : ev.srcElement;
    			console.log(ev.type);
    			console.log(Target.tagName)
    		})
    	}
    </script>
    

      

  • 相关阅读:
    SQL Server 删除重复数据只保留一条
    英语冠词有哪些?
    英语基本语法
    统一身份认证服务(客户端用户身份验证)
    解决MVC中使用BundleConfig.RegisterBundles引用Css及js文件发布后丢失的问题
    统一身份认证服务 源码(客户端)
    MVC 如何设定默认默认路由为指定的Area下的某个action(笔记)
    MongoDB安装笔记
    消息队列第二篇:MessageQueue实战(课程订单)
    消息队列第一篇:MessageQueue介绍
  • 原文地址:https://www.cnblogs.com/jf-67/p/8179008.html
Copyright © 2011-2022 走看看