如何限制用戶在可編輯div或Iframe中輸入多於某些字符

Question

我有一個可編輯的div和iFrame。我要求用戶不能輸入每行超過100個字符。用戶可以輸入無限多行，最多有100個字符。

此外，用戶可以返回到任何行，使用箭頭鍵並輸入更多的文本，以防該行少於100個字符。

如何執行此操作？

編輯： 這需要像用戶輸入的實時一樣。

Answer 1

$('#mydivid').keypress(function(e){ 
    if($(this).html().length > 20) 
     e.preventDefault(); 
}) 

Fiddle

Answer 2

你可以使用jQuery keyup事件檢查。

$('DIV ID').keyup(function(){ 
    data = $.trim($('DIV ID')).html().length; 

    if(data > 100) // or add condition as per your requirement 
    { 
    } 
    else 
{ 
    alert('Your message') 
} 
}); 

Answer 3

$(document).ready(function(){ 
var max_length = 100; 
$("#div-editable").keypress(function(){ 
    var return_state = true; 
    $(this).find("div").each(function(){ 
     if($(this).text().length >= max_length) 
     { 
      return_state = false; 
      //break; 
     } 
    }); 
    return return_state; 
}); 

}）;

只需更改max_length以滿足您的需求。

另外，如果您想允許在文本的開始和結束間隔，您可以使用修剪。

您可以在jsFiddle