jquery - 如何在 contenteditable 中停用输入事件(仅输入没有 shift + enter)

Question

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

我想在单击(shift + enter)时转到下一行(点:我只想 shift + enter 转到下一行)，当我单击 enter 键时此 div 中具有 contenteditable 属性的隐藏文本。

请指导我。

Answer 1

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

使用以下示例 html:

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

您可以将 keydown 事件处理程序附加到此元素。然后我们可以使用 event.shiftKey 来检测 shiftKey 是否与我们的回车键一起按下。键 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;
  }
});

---

这个片段展示了这个 Action :

$('#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>