限制contenteditable div高度

div被限制为最大高度为300px，当我输入一些文本时，div达到300px文本overflows.how当div达到300px时停止文本输入。

我用溢出：隐藏; 它只是停止溢出，但仍然可以输入文本。

.editable { overflow:hidden; max-height:300px; border: 1px solid #eee; padding: 5px; border: 1px solid #000; outline: none; width: 300px; min-height: 40px; } 

http://jsfiddle.net/zFzQe/77/

有没有办法测量文本高度并将文本输入限制为300px？

Answer 1

试试这个代码， Demo

 $("editable").addEvent('keypress', function (e) { var element = this; if ((element.offsetHeight < element.scrollHeight) || (element.offsetWidth < element.scrollWidth)) { e.stop(); } }); 

Answer 2

 editable.onkeyup=function(){ if(editable.innerHeight>='300px'){ editable.style.height='300px'; } }