在 IE11 中，当鼠标按下具有 unselectable='on' 属性的 div 元素时未触发模糊事件答案

【问题标题】：In IE11 blur event not fired while mouse down on div element which has unselectable='on' attribute在 IE11 中，当鼠标按下具有 unselectable='on' 属性的 div 元素时未触发模糊事件
【发布时间】：2016-03-13 01:05:47
【问题描述】：

在 IE11 中，当鼠标按下具有 unselectable='on' 属性的 DIV 元素时，未触发模糊事件。在其他浏览器中，当鼠标按下此 DIV 元素时会触发模糊事件

没有不可选择的属性，在此 DIV 上鼠标按下时会触发模糊事件。当鼠标按下此 DIV 时，我需要具有模糊事件的不可选择属性，如何实现这一点？

请在下面找到代码sn-p

 function blurEvent() {
            alert("event fired");
        }

<input type="text" id="hello" onblur="blurEvent()"/>
    <div style="width:300px;height:300px;background:#0ff" unselectable="on">
        dasdasdsa
    </div>

【问题讨论】：

标签： javascript html events

【解决方案1】：

Firefox 和 Webkit 分别通过专有的 -moz-user-select 和 -webkit-user-select 属性支持此功能。但是，Internet Explorer 支持元素上的“不可选择”属性。当设置为“on”值时，不能选择元素内的文本。

所以基本上不用在 div 中设置不可选择的属性，这可以通过 CSS 轻松完成。创建一个类（比如取消选择）并将用户选择选项设置为 none，然后为 div 提供相同的类。

CSS：

.unselect
{
  -moz-user-select: none; /* For firefox */
  -webkit-user-select: none; /* for chrome */
  -ms-user-select: none; /* for IE10+ */
}

然后为div提供这个类'unselect'

<input type="text" id="hello"/>
<div style="width:300px;height:300px;background:#0ff" class='unselect'>
    dasdasdsa
</div>

这样，这将适用于 Firefox/Chrome/IE10+ 浏览器。 div 内的文本将无法选择，并且您的 onBlur 事件也将被触发。这是一个Working JSFiddle 供您参考。

【讨论】：

我已经尝试过了，当按住 SHIFT 键并鼠标单击 DIV 元素时它不起作用。但在其他浏览器中它可以正常工作。
您可以在 IE 11 的情况下禁用“Shift-Click”事件。这里是相同的 Updated JSFiddle。看看它是否适合你，然后告诉我。
我无法禁用 SHIFT 键操作，我必须对此进行一些操作。