jquery - IE8、IE9、IE10 光标闪烁问题

标签 jquery internet-explorer contenteditable text-cursor

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

取消焦点不是一个选项,因为此应用程序中有更多组件,并且此修复程序不适用于这些情况。修复需要完全自主。

最佳答案

只需添加

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

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

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

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

关于jquery - IE8、IE9、IE10 光标闪烁问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13760093/

相关文章:

javascript - 在 contenteditable 中,如何在 Enter 键按下时在 blockquote 之后添加一个段落?

javascript - IE 中 float 和内联 block 元素的 focusin 事件触发

javascript - 处理粘贴到 contentEditable

javascript - Jquery $ ('class' ,这个)选择器不起作用

javascript - 如何使用配置有ajax搜索的select2 jquery插件实现选择所有功能?

html - Sharepoint 2007 和 &lt;!DOCTYPE html>

css - @font-face 不显示在 Internet Explorer 上

javascript - 在 contenteditable 插入符位置占 `<br>` s

javascript - SlidesJS 自动播放不工作

jquery - 每列中第一个 td 不为空的 CSS 选择器