javascript - Chrome 在事件被阻止后显示目标链接

Question

我有以下代码:

HTML:

<a href="#div1">link 1</a>
<a href="#div2">link 2</a>
<a href="#div3">link 3</a>
<a href="#div4">link 4</a>
<div id="div1">div 1</div>
<div id="div2">div 2</div>
<div id="div3">div 3</div>
<div id="div4">div 4</div>

CSS:

a{
    padding-left:20px;
}
div{
    background:cyan;
    margin:600px 0;
}

jQuery:

$('a').click(function(event){
    event.preventDefault();
});

在这里，即使默认的targeting 操作被阻止，chrome 仍然在点击a 标签后显示目标并且我' m 不在链接上悬停(但是，这不会发生在 IE 或 Mozilla 的情况下):

Check this fiddle .

如何解决这个问题？

编辑:

我的意思是 - 即使我没有悬停在链接上也会显示目标。

除此之外，它会让任何非技术用户误以为页面仍在加载。

Answer 1

这是浏览器的 native 行为。它显示 URL，因为它是 事件 链接的 href。该链接在被单击后保持事件状态，因为它具有焦点。如果你想让它不活动，你可以在点击时模糊元素。

$('a').click(function(event){
    event.target.blur();
    event.preventDefault();
}); 

虽然在链接悬停时 URL 仍然可见。