IE 问题：在后台输入时，光标显示在叠加 div 上

Question

我们在页面上有 div 覆盖和输入，而在某些操作上我们显示模型 window（这里是自定义菜单）。

问题：在 Internet Explorer 中，当模型 window 处于前台时我们关注在文本输入和问题上，它的光标在模型上闪烁 window。请在 Internet Explorer 上查看附件 fiddle。我已经在 IE10 和 11 上测试过了。

HTML:
<button onclick="showDiv()">Show Div</button>
<div>
</div>
<input type="text" />

script:
function showDiv (){
    $('div').show()
    setInterval(function(){
        $('input').focus();
    },200);
}

http://jsfiddle.net/arunthakur14/qobvawr9/

Answer 1

此问题似乎已在别处记录，似乎是一个 IE 错误：

但是，这里有一个经过修改的解决方案，希望能满足您的需求 - 将此 jQuery 代码添加到您的页面，如果叠加层 div 可见，它将把焦点从输入中移开：

(function () {
    if ( document.documentMode && document.documentMode < 12 ) {
        $( document ).on( "focus", ":input", function ( event ) {
            if ($('div').is(':visible')) {
                event.target.blur();
            };
        });
    }
}());

这是修改后的 JSFiddle 答案：http://jsfiddle.net/qobvawr9/1/

IE 问题：在后台输入时，光标显示在叠加 div 上

IE issue: cursor showing on overlay div while input in background

javascript

css

internet-explorer

overlay

overlapping