javascript - 两个文本框，其中一个字符数有限，另一个文本框包含剩余字符

Question

我想制作两个文本框，这样如果一个人写了一些文本，前 50 个字符应该在第一个文本框中，接下来输入的应该进入下一个文本框

在 jquery 或 Javascript 中

代码看起来像这样

var content_id = 'editable_div';
最大值 = 50；

//binding keyup/down events on the contenteditable div
$('#'+content_id).keyup(function(e){ check_charcount(content_id, max, e); });
$('#'+content_id).keydown(function(e){ check_charcount(content_id, max, e); });

function check_charcount(content_id, max, e)
{   
    if(e.which != 50 && $('#'+content_id).text().length > max)
    {
       //the remaining part focusing the mouse on to the next div let the id of the  next editable div be  next

        e.preventDefault();
    }
}

Answer 1

我认为用户正在打字。 http://jsfiddle.net/sechou/fwU8D/

$("textarea:eq(0)").keyup(function(){
    if($(this).val().length>=10){ //for test: 10
          var str  =$(this).val();
          var length = str.length;
          $("textarea:eq(0)").val(str.slice(0,10));
          $("textarea:eq(1)").val($("textarea:eq(1)").val()    
                                  +str.slice(10,length));

    }
});
$("textarea:eq(0)").keydown(function(){
   if($(this).val().length>=10){//for test: 10              
          var str  =$(this).val();
          var length = str.length;
          $("textarea:eq(0)").val(str.slice(0,10));
          $("textarea:eq(1)").val($("textarea:eq(1)").val()    
                                  +str.slice(10,length));

    }
});
$("textarea:eq(0)").change(function(){
   if($(this).val().length>=10){//for test: 10
          var str  =$(this).val();
          var length = str.length;
          $("textarea:eq(0)").val(str.slice(0,10));
          $("textarea:eq(1)").val(str.slice(10,length));
          $(this).attr("readonly","readonly");
    }
});

HTML

<textarea id="first"></textarea>
<textarea id="second"></textarea>