1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    6.     <title>Document</title>
    7.     <style>
    8.         textarea{
    9.             border:1px solid #333;
    10.         }
    11.     </style>
    12. </head>
    13. <body>
    14.     <p>还可以输入<em id="em" style="color:red">0</em>/30</p>
    15.     <textarea  id="txt" cols="30" rows="10"></textarea>
    16.     <script>
    17.         var txt =  document.getElementById("txt");
    18.         var em =  document.getElementById("em")
    19.         txt.onkeydown = function(){
    20.             var length = this.value.length;
    21.             if(length<=30){
    22.                 em.innerHTML =  this.value.length;
    23.             }else{
    24.                 alert("只能输入30个字符")
    25.             }
    27.         }
    28.     </script>
    29. </body>
    30. </html>

    1.PNG