如何在javascript中将html设置为元素中的特定位置

Question

我有一个像这样的div

<div contenteditable="true" >
 Hello this is content editable.... [cursor is blinking here] and more text
</div> 

如何设置光标闪烁的数据。

提前致谢。

Answer 1

你使用execCommand和insertHTML命令：

document.execCommand("insertHTML", false, "the HTML to insert");

实例：

$("div").on("keydown", function(e) {
  if (e.ctrlKey && e.which == 81) {
    document.execCommand("insertHTML", false, "<strong>inserted</strong>");
    return false;
  }
});

<p>Put your cursor in the relevant location below, then press Ctrl+Q:</p>
<div contenteditable="true">
 Hello this is content editable....  and more text
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

遗憾的是，这似乎不适用于IE11。 ： - |对于跨浏览器支持，您可以查看Tim Down's rangy library。