Javascript单击事件处理程序-如何获取对所单击项目的引用？
Javascript单击事件处理程序-如何获取对所单击项目的引用？
提问于 2011-10-21 15:27:28
我的HTML：
<div id="x" onclick="clickHandler(event)">
<div id="button1">This turns green</div>
<div id="button2">This turns blue</div>
</div>那么，首先，为什么我应该将" event“传递给click处理程序，而event是某种系统关键字吗？另外，由于单击处理程序是在容器div上标识的，我如何知道哪个按钮被单击了？
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-10-21 15:29:52
event是一个事件对象，它是在触发事件时自动创建的。请注意，您不必将其称为event (我倾向于简单地将其称为e)。该事件对象具有许多属性，这些属性描述了它所表示的事件。在本例中，您感兴趣的是target，它显示了作为事件源的元素：
function clickHandler(e) {
var target = e.target;
}这是一个working example。
不幸的是，事情从来没有那么简单。虽然规范说它应该是event.target，但Internet Explorer喜欢不同，并选择使用event.srcElement，所以您可能想要检查一下，以确保event.target存在！例如：
function clickHandler(e) {
var target = (e.target) ? e.target : e.srcElement;
}Stack Overflow用户
发布于 2011-10-21 15:40:12
我通常只是在对click处理程序的调用的参数列表中命名被单击的元素，类似于(未测试)如下：
<div id="x">
<div id="button1" onclick="handle_click_event( this, 'green' )">This turns green</div>
<div id="button2" onclick="handle_click_event( this, 'blue' )">This turns blue</div>
</div>
function handle_click_event ( obj, new_color ) {
obj.style.backgroundColor = new_color;
}这种方法对你有效吗？
Stack Overflow用户
发布于 2011-10-21 15:29:33
为什么你不能这么做呢？
<div id="x">
<div id="button1" onclick="clickHandler1()">This turns green</div>
<div id="button2" onclick="clickHandler2()">This turns blue</div>
</div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7846268
复制相关文章
相似问题