使div无法获得焦点（如工具栏按钮）

Question

有没有办法让div无法获得焦点？这是工具栏按钮的正常行为。

假设重点是文本输入。单击div不应该使文本输入的焦点丢失。

这是一个基本设置：

HTML：

<div id="toolbar-button">
    Button
</div>
<input id="input">

我试图重新关注div的mousedown事件，但确实如此 不工作：

document.getElementById('toolbar-button').addEventListener('mousedown', function(event) {
    document.getElementById('input').focus();
})

使用click事件会重点关注点击，但是当鼠标按钮仅关闭时，焦点仍会丢失（并且之后发生点击事件也不会被授予）。

这是一支笔：

http://codepen.io/anon/pen/oxjPva

我知道通过设置tabindex = "-1"可以使元素无法在标签上获得焦点。但这对鼠标事件不起作用。

Answer 1

将此行添加到您的侦听器：

event.preventDefault();

它将阻止在按钮上设置焦点，按下按钮时的默认操作。