jquery - 如何在 contenteditable 中停用输入事件（仅输入无 shift+enter）

Question

我想contenteditable在我的代码中使用属性，但我有一个问题。

我想在单击（shift + enter）时进入下一行（点：我只想要 shift + enter 到下一行）并且当我单击时在此具有contenteditable 属性的 div 中输入键隐藏文本。

请指导我。

Answer 1

您可以为此使用 keydown 事件。Mdn有关于此事件的更多信息。

使用以下示例 html：

<div id="pinky" contenteditable="true">Pink unicorns are blue</div>

您可以将 keydown 事件处理程序附加到此元素。然后我们可以使用event.shiftKey来检测 shiftKey 是否与我们的 enter 键一起被按下。键 13 是“输入”键之一。

$('#pinky').on('keydown', function(e) {
  if (e.which === 13 && e.shiftKey === false) {
    //Prevent insertion of a return
    //You could do other things here, for example
    //focus on the next field
    return false;
  }
});

---

此片段显示了这一点：

$('#pinky').on('keydown', function(e) {
  if (e.which === 13 && e.shiftKey === false) {
    //Prevent insertion of a return
    //You could do other things here, for example
    //focus on the next field
    return false;
  }
});

#pinky {
  background: pink;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="pinky" contenteditable="true">Pink unicorns are blue</div>