javascript - 如何限制用户在可编辑的 div 或 iframe 中输入超过某些字符

Question

我有一个可编辑的 div 和 iFrame。我要求用户每行不能输入超过 100 个字符。用户可以输入无限多行，所有行最多 100 个字符。

此外，如果该行少于 100 个字符，用户还可以使用箭头键返回任何行并输入更多文本。

如何执行此操作？

编辑：这需要像用户键入时实时一样。

Answer 1

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

小提琴

Answer 2

您可以检查 jquerykeyup事件。

$('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 即可。

如果您想在文本的开头和结尾允许间距，也可以使用 Trim。

你可以在jsFiddle上查看