javascript - 链接点击事件被父 mousedown 事件阻止

Question

我在这样的标题中有一个链接

<table id="mytable" border=1>
<thead>
  <th id='myHeader'><a href="#" class="sortHeader">HelloWorld</a></th>
</thead>
</table>

还有一些示例 javascript，在链接上连接点击事件，在表头元素上连接鼠标移动事件。

var randomFunction = function(event, id){
    alert('header was moved');
}

$('#mytable').on('click', '.sortHeader', function(evt){
    alert('header was clicked')
});

var header = document.getElementById('myHeader');
header.addEventListener('mousedown', randomFunction);

不幸的是，当我添加 mousedown 时，单击事件不再由单击触发。我已经检查了谷歌开发者工具中的事件，它们都在那里。如何触发点击事件？

这是一个完整的 jsfiddle:https://jsfiddle.net/nickwinters/xLz8agy0/1/

Answer 1

您需要使用 console.log(); 而不是 alert()。

因为在鼠标按下时调用 alert() 函数，它会在点击函数中用 mouseup 中断，因此点击函数中的 alert 是未触发。