javascript - 字符限制在键盘上的两个文本区域中不起作用

Question

我有两个文本区域并添加 bootstrap max length限制第二个文本区域中的字符，如下所示:

$('input[maxlength], textarea#description').maxlength({
  alwaysShow: true,
  warningClass: "form-text text-muted mt-1", 
  limitReachedClass: "form-text text-muted mt-1",    
});

html:

<textarea id="summery" class="form-control my-5" placeholder="My textarea"></textarea>
<textarea id="description" class="form-control my-5" placeholder="My textarea" maxlength="100"></textarea>

我使用 keyup 链接两个文本区域，并从第一个文本区域获取值，如下所示:

  $(function(){
      $('#summery').on('keyup', function(e){
          $('#description').val($(this).val());
      });
  });

现在，在第一个文本区域中输入后，我在第二个区域中看到此文本，但 Bootstrap 长度字符不起作用，并且不限于第二个文本区域。我的意思是(我需要):第一个文本区域是无限字符，但第二个文本区域是有限的，当我输入第一个文本区域时停止字符。

演示:https://jsfiddle.net/Ly0p2tox/

Answer 1

可以用if语句解决

 $(function(){
    $('#summery').on('keyup', function(e){
        if($('#summery').val().length<=$('#description').attr("maxlength")){
            $('#description').val($(this).val());
        }
        else{
            $('#description').val($(this).val().substring(0,$('#description').attr("maxlength")));
        }

    });
});