ContentEditable 编辑框中，如何解决 Shift+Enter 换行导致结构混乱的问题？

编程并不是一个机械性的工作，而是需要有思考，有创新的工作，语法是固定的，但解决问题的思路则是依靠人的思维，这就需要我们坚持学习和更新自己的知识。今天golang学习网就整理分享《ContentEditable 编辑框中，如何解决 Shift+Enter 换行导致结构混乱的问题？ 》，文章讲解的知识点主要包括，如果你对文章方面的知识点感兴趣，就不要错过golang学习网，在这可以对大家的知识积累有所帮助，助力开发能力的提升。

contenteditable 编辑框中 Shift+Enter 换行后结构混乱

在使用 contenteditable 属性开启编辑功能的文本域中，当用户按住 Shift+Enter 时会出现换行添加
标签的问题，导致结构混乱。要解决此问题，可以使用以下方法：

在 keyDown 事件中，使用 event.preventDefault() 阻止默认动作，然后用 document.execCommand('insertParagraph') 插入一个段落。

function keyDown (event) {
  if (event.shiftKey && event.keyCode === 13) {
    event.preventDefault();
    document.execCommand('insertParagraph');
    return false;
  }
  
  document.execCommand('formatblock', false, '<p>');
}

将上面的代码添加到示例中，在 Chrome 中测试，问题得到解决。

终于介绍完啦！小伙伴们，这篇关于《ContentEditable 编辑框中，如何解决 Shift+Enter 换行导致结构混乱的问题？ 》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~golang学习网公众号也会发布文章相关知识，快来关注吧！