IE8、IE9、IE10 闪烁光标问题答案

【问题标题】：IE8, IE9, IE10 Blinking Cursor IssueIE8、IE9、IE10 闪烁光标问题
【发布时间】：2012-12-07 09:18:28
【问题描述】：

我正在制作一个在某些文本选择上显示工具栏的编辑器。我在 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>

由于此应用程序中有更多组件，因此无法选择将焦点移出，并且此修复程序不适用于这些情况。修复需要完全自主。

【问题讨论】：

如果您无法操纵焦点，那么您可能会运气不佳，因为光标似乎是由浏览器本机控制的，正如this example中所指出的那样
@ZachEsposito ：是的，专注似乎是唯一的选择，但却是非常糟糕的选择。这意味着我必须在 contenteditable 之上的所有其他组件中进行修复。

标签： jquery internet-explorer cursor contenteditable

【解决方案1】：

只需添加

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

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

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

UDP1 抱歉，没有看到您关于“焦点”的更新不是一个选项...

【讨论】：