防止在内容可编辑的div中写换行

Question

如何防止用户使用内容可编辑的div中的Enter键编写新行？

到目前为止，我已经尝试过（可编辑div的ID为editable：

$('#editable').on('keyup', function(e) {
    if (e.which == 13) {
        event.preventDefault();
    }
});

但是这不起作用。

可以使用JS和jQuery吗？

编辑

我被告知按Enter键不会插入新行，因此我在可编辑div内放了一张图片，显示按回车时发生的情况。

我希望代码基本上保留在一行上，即使用户按下Enter键。

Answer 1

代替keyup，使用keydown。

const ediatble = document.querySelector('#editable');
ediatble.addEventListener('keydown', e => {
  if (e.key === 'Enter') {
    e.preventDefault();

  }
});

See example on JSFiddle

Answer 2

代替keyup，您可以尝试使用keydown

$('#editable').on('keydown', function(e) {
   return e.which != 13;
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="editable" contenteditable>Some Content</div>