在光标位置为新行编写HTML标记

Question

我将游标放在lorem之后，然后按Enter

默认情况下，按enter，Chrome会在此处写入自己的span标记。

$("#test").keydown(function(e) {
  if (e.keyCode == 13) {
    e.preventDefault();
    var a = "<br>\n";
    /* here I need something like this:
    write - on - cursor - position(a); */

  };
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="test" contenteditable="true">loremIpsum</div>

Answer 1

删除此属性e.preventDefault();，将启用所需的行为。

$("#test").keydown(function(e) {
  if (e.keyCode == 13) {
    /* e.preventDefault(); */
    var a = "<br>\n";

  };
});

#test {
  height: 100px;
  width: 75%;
  padding:10px;
  margin: 10px;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="test" contenteditable="true">loremIpsum</div>