主页 / 问题 / 636855
Accepted
VaskM
Asked:2020-03-08 19:17:11 +0000 UTC2020-03-08 19:17:11 +0000 UTC

内容可编辑缩进（制表符）

  • 772

下面有一个例子。如何使其在按下时Tab在文本（段落）中插入缩进而不是移动到下一个页面元素？

<div class='test' contentEditable='true'>Some text</div>
javascript

1 个回答

  1. Best Answer

    我最近从对 EN.SO 的回答中为自己重新做了一些类似的事情

    let divs = document.getElementsByClassName("test");
[].forEach.call(divs, function(item) {
  item.addEventListener("keydown", function(e) {
    if (e.keyCode === 9) {
      e.preventDefault();
      let div = this;
      let selection = div.ownerDocument.defaultView.getSelection();
      let range = selection.getRangeAt(0);
      let tab = document.createTextNode("\u00a0\u00a0\u00a0\u00a0");
      range.insertNode(tab);
      range.setStartAfter(tab);
      range.setEndAfter(tab);
      selection.removeAllRanges();
      selection.addRange(range);
    }
  })
})
    <div class='test' id="editor" contentEditable='true'> Some text</div>

    • 2

相关问题