Javascript 防止输入的文本超过contenteditable divs静态大小

基本上，我在JSFIDLE中制作了我想要的东西。但这意味着使用contenteditable div而不是textarea。我不介意div是否为100%宽度，但我希望高度为38px（表示两行文本）

我发现的问题是，当整个区域都已填充时，无法输入更多文本。显然，我不想根据字符数来限制这一点（如果我这样做了，我还可以使用单间距字体）

有什么想法吗

HTML

<div class="writebox">
  <div class="writeboxprefix">Comments:</div>
  <div class="writeboxtext" contenteditable="true">
    Lorem ipsum dolor si wdq wd qwdq wqd wqddwqe dwqdwq wdq wqd 
wdq wqd wqd wqd wdqt
  </div>
</div>

---

没有JS这是不可能的。如果您正在寻找JavaScript解决方案，请相应地标记问题。否则，你的问题就没有答案了。我不介意加入一些JS，我已经在问题中添加了标签。你需要检测keyUp或keyDown上的溢出，例如：这是我到目前为止所做的，但它似乎不太管用。。。a） 我试图让它在手之前保存插入符号位置，然后在手之后设置插入符号位置-但它似乎回到了开始b）它似乎不想只在滚动条出现时运行-它总是运行而不是？！

.writeboxprefix {
  height: 16px;
  float: left;
  background: white;
  font-style: italic;
  padding-right: 6px;
}

.writeboxtext {
  background-attachment: local;
  background-image: repeating-linear-gradient(white, white 15px, black 
15px, white 16px, white 19px);
  height: 38px;
  resize: none;
}

.writebox {
  font-family: Arial;
  font-size: 10pt;
  line-height: 19px;
  display: block;
  overflow: hidden;
}