点击按钮能不能不触发input框失去焦点事件？

Question

<input type="text"/>
<button>按钮</button>

当前input 设置了失去焦点事件 input并且在获得焦点状态 当我点击按钮能不能不触发input 失去焦点事件？

Answer 1

完全可以。
只要给按钮设置 mousedown 事件，并在其中 event.preventDefault() 就可以了

// html
<input type="text" autofocus="autofocus">
<button>点击我文本输入框不会失去焦点</button>

// javascript
var btn = document.querySelector('button')
btn.onmousedown = function(event) {event.preventDefault()}

题主想要点击按钮，触发按钮的 click 事件，但又不想触发 input 的 blur 事件。 这里面的问题就在于，当我们点击按钮的时候，文本框失焦，这是浏览器的默认事件。当你点击按钮的时候，会触发按钮的 mousedown 事件，mousedown 事件的默认行为是使除了你点击的对象之外的有焦点的对象失去焦点。所以只要在 mousedown 事件中阻止默认事件发生就可以了！

Answer 2

其实并不是很理解，因为input的失去焦点事件本身就有的吧，即便你不设置的话。
可能不大明白你的需求，或者你可以考虑在失去焦点判断如果event.target是这个按钮就不触发。
或者换个思维？点击按钮时给input获得焦点？

Answer 3

点击按钮一定会触发 blur 事件，不需要自己写代码

Answer 4

你点击了按钮， input框不就失去焦点了？事件就触发了！