javascript - 子点击事件影响父事件

Question

我有这样的 HTML 结构:

<table>
    <tr onclick="alert ('parent event')">
        <td>
             <input type="button" name="click me" value="I'm a button" id="click me" />
        </td>
    </tr>
</table>

现在我在 tr 上绑定(bind)了一个点击事件，现在如果我点击按钮，tr 上的点击事件也会被触发。

我怎样才能阻止这种情况发生？

Answer 1

将您的输入 ID 更改为 click-me(不带空格)，然后将其放在脚本标记之间:

window.onload = function() {
    document.getElementById('click-me').onclick = function(e) {
        e.stopPropagation();
        return false;
    }
}

或者您可以简单地将以下代码放入 onclick 属性中:

<input type="button" onclick="event.stopPropagation();" ...

http://jsfiddle.net/qwk38/