Question

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

以下是此问题的示例：

$('.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>

关注焦点不是一个选项，因为此应用程序中有更多组件，此修复程序不适用于这些情况。修复需要完全自治。

Answer 1

添加

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

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

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

<强> UDP1 抱歉没有看到关于'焦点'的更新不是一个选项......

IE8，IE9，IE10闪烁光标问题

1 个答案: