1. 事件背景
我的项目原来须要在进入页面后focus一个可输出组件，比如说下拉输入框；在页面更新之后也会focus一个可输出组件。
起初减少了新需要：要求下拉输入框在下拉抉择赋值的根底上，能间接输出关键字赋值。
间接输出关键字意味着须要在blur后向后盾发送申请获取对应的值。
这样就存在一个问题：进入页面后focus下拉输入框A--》输出关键字--》失焦--》获取返回数据并赋值--》更新界面。如果是通过点击其余控件B失焦，那么这个B上绑定的mousedown前面的事件都将无奈触发。
2. 相干常识
2.1 mousedown,mouseup,click,blur,focus事件的触发程序：
html代码：
<div id="testBox"> <div><button class="test-btn"></button></div> <div><input type="text" class="test-input"/></div></div>js代码：
var btn = document.getElementsByClassName("test-btn")[0];var input = document.getElementsByClassName("test-input")[0]; btn.addEventListener("mousedown", function (e){ console.log("mousedown-btn"); }); btn.addEventListener("mouseup", function (e){ console.log("mouseup-btn"); }); btn.addEventListener("click", function (e){ console.log("click-btn"); }); input.addEventListener("focus", function (e){ console.log("focus-input"); }); input.addEventListener("blur", function (e){ console.log("blur-input"); });操作：input输出而后点击button
后果："focus-input"--》"mousedown-btn"--》"blur-input"--》"mouseup-btn"--》"click-btn"
2.2 document.activeElement
3. 总结
事件绑定要留神焦点元素，否则可能导致元素事件无奈触发。