IE8，IE9，IE10闪烁光标问题 [英] IE8, IE9, IE10 Blinking Cursor Issue

问题描述

我正在做一个编辑器，显示一些文本选择上的工具栏。我在IE中面临的问题是闪烁的光标仍然显示在工具栏上方。
这是特别发生在IE。

I am making an editor which shows a toolbar on some text selection. The issue that I am facing in IE is that the blinking cursor still shows above the toolbar. This is specifically happening in IE. The blinking cursor comes on top.

以下是此问题的示例：

$('.content').mouseup(function(e) {
  $('.shy').css({
    top: e.pageY - 30 + 'px',
    left: e.pageX - 30 + 'px'
  });
  $('.shy').show();
});

.content {
  height: 300px;
  width: 300px;
  border: 1px solid black;
  overflow: hidden;
  word-wrap: break-word;
  z-index: 1;
}
.shy {
  height: 100px;
  width: 100px;
  background-color: orange;
  z-index: 2;
  overflow: hidden;
  word-wrap: break-word;
  display: none;
  position: absolute;
}

<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<div contenteditable="true" class='content'>Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content</div>
<div class='shy'>
  <div>

在这个应用程序有更多的组件，这个解决方案将不适用于这些情况。修复需要完全自主。

Taking the focus out is not an option as there are more components in this application and this fix will not work for those situations. The fix needs to be completely autonomous.

推荐答案

只需添加

$('.shy').focus();

光标将在IE7-IE10（测试）上停止闪烁

And cursor will stop blinking on IE7-IE10 (tested)

http://jsfiddle.net/2QAxk/6/

UDP1
对不起，没有看到关于'focus'的更新不是一个选项...

UDP1 Sorry didn't see your update about 'focus' not been an option...

这篇关于IE8，IE9，IE10闪烁光标问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！