请问event.currentTarget在IE8-中如何获取呢？
https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget
查询MDN官网，发现event.currentTarget不兼容IE8-（IE8及以下版本的IE浏览器）。
请问应该如何写兼容性方法呢?老师可以给个思路吗？
1
收起
正在回答 回答被采纳积分+1
7回答
我学习太差被关起来了
2019-10-15 11:19:52
我的完整代码如下。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>2-17-event.currentTarget的兼容性</title>
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<base target="_blank">
<style type="text/css">
body
{
margin: 0;
padding: 0;
background-color: #DCDCDC;
}
#ulList
{width: 100px;}
#ulList > li
{
width: 100px;
height: 30px;
line-height: 30px;
}
#ulList > li + li
{border-top: 1px solid red;}
</style>
<script type="text/javascript">
window.onload = function ()
{
// 浏览器分为以下两派
// 主流派：Chrome、Firefox、Opera、Safari、Edge、IE9+
// 老旧派：IE8-
var EventUtil =
{
// 事件绑定
addListener: function (target, type, listener)
{
if (target.addEventListener)
{
target.addEventListener(type, listener);
}
else if (target.attachEvent)
{
target.attachEvent("on" + type, listener);
}
else
{
target["on" + type] = listener;
}
},
// 事件解绑
removeListener: function (target, type, listener)
{
if (target.removeEventListener)
{
target.removeEventListener(type, listener);
}
else if (target.detachEvent)
{
target.detachEvent("on" + type, listener);
}
else
{
target["on" + type] = null;
}
},
// 事件触发的目标对象
getEventTarget: function (event)
{
return event.target || event.srcElement;
},
// 事件绑定的目标对象
getEventCurrentTarget: function (event)
{
return event.currentTarget;
},
// 禁止默认行为
preventDefault: function (event)
{
if (event.preventDefault)
{
event.preventDefault();
}
else
{
event.returnValue = false;
}
},
// 阻止事件冒泡和捕获
stopPropagation: function (event)
{
if (event.stopPropagation)
{
event.stopPropagation();
}
else
{
event.cancelBubble = true;
}
}
};
var ulList = document.getElementById("ulList");
// 点击每一项li，弹出事件绑定的元素的id：ulList
// 以下代码经测试，不兼容IE8-
EventUtil.addListener(ulList, "click", function (event)
{
alert((EventUtil.getEventCurrentTarget(event) || this).id);
});
}
</script>
</head>
<body id="body">
<ul id="ulList">
<li id="li1">item 1</li>
<li id="li2">item 2</li>
<li id="li3">item 3</li>
<li id="li4">item 4</li>
<li id="li5">item 5</li>
<li id="li6">item 6</li>
</ul>
</body>
</html>经测试，alert((EventUtil.getEventCurrentTarget(event) || this).id); 不兼容IE8-。这里IE8-是指IE8以及更低版本的IE浏览器。
IE8、IE7和IE5的运行结果如下，显示undefined，而不是ulList。因此，问题未解决，请老师指点。
IE9+的运行结果如下，显示ulLIst，得到预期结果。
好帮手慕夭夭
2019-10-14 23:10:18
你好同学，解答如下：
1.var et = e || evet; 确实多余，你那样写可以。
2. 首先如下兼容性写法不对，this指向函数的调用者。
代码中，getEventCurrentTarget方法是EventUtil调用的，所以如上this指向的不是事件绑定的对象，而是EventUtil。
如果想要通过this兼容，应该在事件中写this。因为事件处理函数是目标对象触发的：
先把getEventCurrentTarget中去掉
然后在事件中通过this获取：
3.第二个只是给同学讲解了一下this的指向问题，在本代码中，解决ie10兼容问题很简单，就是通过传递event参数。
虽然代码中不传递也会有event对象，但是在ie10下，这个event是没有currentTarget属性的。所以打印undefined。需要如下定义参数，然后传递过去再使用才行。（每一个事件中，都应该先定义event参数，然后再使用才规范哦）
然后在ie10中就可以获取id了哦
祝学习愉快，望采纳。
我学习太差被关起来了
2019-10-13 22:38:24
event.currentTarget的浏览器兼容性，我的代码如下：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>2-17-event.currentTarget的兼容性</title>
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<base target="_blank">
<style type="text/css">
body
{
margin: 0;
padding: 0;
background-color: #DCDCDC;
}
#ulList
{
width: 100px;
}
#ulList > li
{
width: 100px;
height: 30px;
line-height: 30px;
}
#ulList > li + li
{
border-top: 1px solid red;
}
</style>
<script type="text/javascript">
window.onload = function ()
{
// 浏览器分为以下两派
// 主流派：Chrome、Firefox、Opera、Safari、Edge、IE9+
// 老旧派：IE8-
var EventUtil =
{
// 事件绑定
addListener: function (target, type, listener)
{
if (target.addEventListener)
{
target.addEventListener(type, listener);
}
else if (target.attachEvent)
{
target.attachEvent("on" + type, listener);
}
else
{
target["on" + type] = listener;
}
},
// 事件解绑
removeListener: function (target, type, listener)
{
if (target.removeEventListener)
{
target.removeEventListener(type, listener);
}
else if (target.detachEvent)
{
target.detachEvent("on" + type, listener);
}
else
{
target["on" + type] = listener;
}
},
// 事件触发的目标对象
getEventTarget: function ()
{
return event.target || event.srcElement;
},
// 事件绑定的目标对象
getEventCurrentTarget: function ()
{
return event.currentTarget || this;
},
// 禁止默认行为
preventDefault: function ()
{
if (event.preventDefault)
{
event.preventDefault();
}
else
{
event.returnValue = false;
}
},
// 阻止事件冒泡和捕获
stopPropagation: function ()
{
if (event.stopPropagation)
{
event.stopPropagation();
}
else
{
event.cancelBubble = true;
}
}
};
var ulList = document.getElementById("ulList");
// 点击每一项li，弹出对应的内容
// 事件触发的目标是li元素，但是事件绑定的目标却是ul元素
// 这就是事件委托
// 以下代码经过测试，兼容两派的浏览器
// EventUtil.addListener(ulList, "click", function ()
// {
// alert(EventUtil.getEventTarget().innerHTML);
// });
// 点击每一项li，弹出事件绑定的目标的id：ulList
// 以下代码经测试，不兼容IE10-
EventUtil.addListener(ulList, "click", function ()
{
alert(EventUtil.getEventCurrentTarget().id);
});
}
</script>
</head>
<body id="body">
<ul id="ulList">
<li id="li1">item 1</li>
<li id="li2">item 2</li>
<li id="li3">item 3</li>
<li id="li4">item 4</li>
<li id="li5">item 5</li>
<li id="li6">item 6</li>
</ul>
</body>
</html>点击每一项列表项li，在IE10-弹窗显示undefined，而不是事件绑定的对象的id：ulList。
请问这应该如何解决呢？getEventCurrentTarget的方法如何才能做到两派兼容？
我学习太差被关起来了
2019-10-13 22:05:30
上图中红色方框的写法是多余吗？
为什么不直接写成如下：
list.onclick = function ()
{
if (event.currentTarget)
{
event.currentTarget.style.backgroundColor = "red";
}
else
{
this.style.backgroundColor = "red";
}
}
好帮手慕慕子
2019-10-12 14:14:26
同学你好， 因为js语规定，绑定事件函数传入的第一个参数就表示事件对象，所以这里的参数e就是代表事件对象（event）， 又因为这里是个形参，所以可以任意命名，只要在函数内部使用名称一致即可
详细信息可以参考MDN https://developer.mozilla.org/zh-CN/docs/Web/API/Event
如果帮助到了你， 欢迎采纳！
祝学习愉快~~~
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星