IE9 内容可编辑中显示错误的光标

Wrong cursor showing in IE9 contenteditable

本文关键字：显示 错误 光标 编辑 IE9      更新时间：2023-09-26

>我有一些html如下（对于IE9）：

<div contenteditable="true">
   Some editable text
   <span class="code" contenteditable="true" unselectable="on">uneditable text</span>
   more editable text
</div>
在IE9中，跨度内容可编辑必须设置为"true"才能使跨度不可编辑

，而在Chrome中，它设置为"false"以使跨度不可编辑！！

但是，在IE9中，当鼠标越过范围时，光标显示为移动光标（交叉箭头）。我的 css 文件中的光标设置为"指针"，但这不适用于 IE9。

如何在IE9中将光标更改为手形或箭头？

以下内容

在IE9和Chrome 38上都适合我，范围的内容是可编辑的，范围之外的文本不可编辑。光标也是将鼠标悬停在任何文本上时所期望的相同键入光标。

我注意到的唯一差异是，在 Chrome 上，在编辑模式下，跨度以蓝色突出显示。

<div>
Some NOT editable text
<span class="code" contenteditable="true">EDITABLE text</span>
more NOT editable text
</div>

例如，Visual Stidio IDE上的HTML5验证会告诉您contententeditable不是元素div的有效属性，unselectable也不是元素span的有效属性。

如果您仍然遇到光标问题，请发布您的 CSS。

使可编辑元素的子元素不可编辑是一项混乱的工作，浏览器版本之间存在错误和不兼容; 例如，请参阅内容可编辑=假 在内容可编辑=true 块在IE8中仍然可以编辑，HTML内容可编辑与不可编辑的岛

但是您显然已经找到了使用非标准属性unselectable=on的解决方法（对于IE）。通过使元素不可选择，它也使其不可编辑，因为无法对其进行编辑。正是此属性在这里对IE很重要，您应该使用逻辑contenteditable=false来覆盖其他浏览器。这将使光标成为text光标，这比您现在拥有的光标更少混乱。可以说这是误导性的，但IE显然IE希望将光标用于可编辑元素及其子元素text（尽管不合逻辑的组合contenteditable=true unselectable=on似乎会导致光标move）。毕竟，它是可编辑的，包括不可编辑的岛，因为整个岛可以被移除或替换。无论如何，在这种情况下，IE会忽略CSS中的cursor属性设置。

相关文章：