IE11获取焦点兼容性问题

Question

环境

• 包：

• react

• react-timeout

• 浏览器：

• 版本 11.576.14393.0

• 更新版本 11.0.38

• 版本11.0.9600.18816

• 更新版本 11.0.47

• IE11

• IE11

现状

• select组件，select的下拉框组件。当列表过多出现滚动条时候，拖动滚动条，两个版本行为不一致。

• 第一个版本的IE11，当拖动滚动条，焦点在body上

• 第二个版本的IE11，当拖动滚动条，焦点在下拉框上

关键代码

onBlur = (e)=>{

    //IE系列浏览器在拖动滚动条时会让dropdown获得焦点，input失去焦点

    let dropdown = ReactDOM.findDOMNode(this.refs.dropdown);

    if(dropdown && dropdown.contains(document.activeElement)) return;

    this.delayToHide();

}

预期结果

当拖动滚动条时候，下拉框不消失

问题

如何进行兼容性判断？让拖动滚动条，下拉框不消失。

Answer 1

input失焦 同时判断dropdown是不是获取了焦点 如果是就不隐藏，然后 添加dropdown失焦事件 同时判断input是不是也失去焦点 如果都失去焦点 就隐藏。