Question

首先，我想澄清一下，我搜索过很多论坛和博客的答案，甚至是webkit博客，但没有找到答案！

情况：

使用document.createElement
直接分配onclick事件，例如：button.onclick = showResult;
修改按钮innerHtml / append img节点（我已尝试过两者），在其中放入一个放大镜png图标。
定义showResult函数，它接收evt参数，然后尝试获取目标tagName属性，但是当你点击图标时，它会返回'IMG'而不是'BUTTON'

以下是片段：

td = document.createElement( 'td' );
btn = document.createElement( 'button' );
btn.type = "button";
btn.onclick = showResults;
btn.innerHTML = '<img src="../img/mag.png" />';
td.appendChild( btn );

功能

function showResults( evt ) {
    console.log( evt.target.src );
}

我使用此条件修复此问题：

var btn = evt.target == 'BUTTON' ? evt.target : evt.target.parentNode;

但我真的不喜欢它，有没有关于这种行为的解决方法或某些事情，你可以指出我的目的？

非常感谢！ Muchas gracias ありがとうございます（Arigatou gozaimasu）

Answer 1

我希望这可以帮到你

var btn = document.getElementById('btn');
btn.onclick = function(e) {
    clickedButton = e.currentTarget;
    console.log(clickedButton);
}

检查示例http://jsfiddle.net/Kohver/RD3Zg/

为什么onclick事件被谷歌浏览器中的按钮标记的子节点触发？

1 个答案: