1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>网站首页</title> 6 <style> 7 .aa{ 8 80%; 9 height:300px; 10 resize:none; 11 padding:10px; 12 } 13 </style> 14 </head> 15 <body> 16 <h1>留言内容</h1> 17 <textarea class="aa" id="bb" autofocus></textarea> 18 <span id="msg"></span> 19 </body> 20 </html> 21 <script> 22 function $(id){ 23 return document.getElementById(id); 24 } 25 String.prototype.trim =function (){ 26 return this.replace(/^s+|s+$/g,''); 27 } 28 var a=$('bb'); 29 a.onkeyup = function (){ 30 if(this.value.length>50){ 31 $('msg').innerHTML='最多输入50个字'; 32 this.value=this.value.trim();//清楚首尾的空格 33 this.value=this.value.substr(0,50);//截取到了50个 字符不让输入 34 }else{ 35 $('msg').innerHTML='你输入了'+this.value.length+'个字'; 36 } 37 } 38 </script>