标签：
什么是currentTarget?
<a id="ad1" data-at="1" href=""> <span id="span1">demo</span> </a> <script> var ad1 = document.getElementById("ad1"); ad1.onclick = function(e){ var e = e || window.event; var target = e.target || e.srcElement; alert(target.id) //"span1" alert(e.currentTarget.id) //"ad1" } </script>
如上面的代码所示，当我给id为ad1绑定click事件时，触发click事件后，在A的click事件处理器中，target为a元素里面的span标签，而非A元素，而currentTarget才是A元素。
《javascript高级程序设计》书中的解释为：
那么问题来了，我想在点击的时候，获取到A元素的data-at属性，该怎么办呢？currentTarget在IE9之前的IE版本都不支持
解决方案有两种：
1.向上寻找父元素
<script> var ad1 = document.getElementById("ad1"); ad1.onclick = function(e){ var e = e || window.event; var target = e.target || e.srcElement; if(target.tagName.toLowerCase != "a"){ target = target.parentNode } alert(target.id) // ad1 var at = 0; if(target.dataset){ at = target.dataset.at }else{ at = target.getAttribute("data-at"); } } </script>
2.修改this指针，并在IE下将ad1赋值给event.currentTarget
<script>
var ad1 = document.getElementById("ad1");
var addListener = (function() {
if(document.attachEvent) {
return function(element, event, handler) {
element.attachEvent(‘on‘ + event, function() {
var event = window.event;
event.currentTarget = element;
event.target = event.srcElement;
handler.call(element, event);
});
};
}
else {
return function(element, event, handler) {
element.addEventListener(event, handler, false);
};
}
}());
addListener(ad1,"click",function(e){
var currentTarget = e.currentTarget;
var at =0;
if(currentTarget.dataset){
at = currentTarget.dataset.at
}else{
at = currentTarget.getAttribute("data-at");
}
alert(at)
})
</script>
标签：
原文地址：http://www.cnblogs.com/fiona-xiaofan/p/4492068.html
