javascript - 'mousedown' 的 addEventListener 与 'click' 的 addEventListener 不同

Question

我将带有循环的 addEventListener 添加到一些 anchor 元素 products 中，如下所示:

for(var j=0;j<productions.length;j++){
    productions[j].addEventListener('click',production_e,false);
}

问题:这可行，但当我将其更改为“mousedown”时，它在完成所有 XHR 获取后遵循默认 anchor 链接。

函数 Production_e() 测试单击了哪个“生产”，然后检查它是否包含生产的描述。如果没有，它会启动 XHR 来检索描述并将其插入到生产元素中。

function production_e(e) {
  e.preventDefault();
  if(!current_show) {
    current_show = this;
    if(!this.getElementsByClassName('production_description')[0])
        get_production_article(this,show_description);
  }
}

get_production_article = function(production,callback) {
    var req = new XMLHttpRequest();
    req.onreadystatechange = function(e) {
        if(req.readyState === 4 && req.status === 200) {
            install_article(production,req.responseText);
            callback(production);
        }
    }
    var pl = production.getElementsByClassName('production-link')[0];
    req.open('GET',pl.href + '-article',true);
    req.send();
}

函数install_article只是将responseText插入到DOM中，回调函数show_description设置样式以公开元素。

但是，当我使用 mousedown 时，单击鼠标左键似乎会执行所有相同的任务，但随后会按照默认 anchor 链接到达另一个页面。有趣的是，单击鼠标右键的效果与我期望单击鼠标左键的效果一样。

我猜测，以某种方式，preventDefault() 函数没有通过或被重新触发，但我不知道这是如何发生的。我错过了什么？

Answer 1

好吧，阻止 mousedown 默认值不会阻止 click 事件的发生，并且它是默认值。您还必须监听点击事件以防止默认的点击行为。