问题来源：
网站后台有个内容简介部分，限制输入的字符数量在100以内。之前用的是单行的textbox服务器控件，在属性中设置maxLength=100之后就可以限制字符数量到100，但是它是单行的，100个字符只能显示几十个，输入的时候不方便，于是在后台改版的时候想把它变成多行显示的，这样看起来舒服一些。但是把它属性textmode改为MultiLine后，textbox在前台是以textarea标签展现的，MaxLength属性就失效了。这就造成了现在所说的问题。
如何解决：
因为百家号同样有限制标题输入的，所以仿照百家号后台输入的形式，在输入框后面加了个字符数提示，如下图：
再利用js实时检测输入框中的字符，显示在后面就可以了，超过了100个字符就用红色字体提示：
这样出来的效果就能满足最初的需求了。
下面是代码：
<script type="text/javascript">
function countChar(textareaName,spanName)
{
document.getElementById(spanName).innerHTML = document.getElementById(textareaName).value.length;
var num = 100 - document.getElementById(textareaName).value.length;
if(num<0){
document.getElementById(spanName).style.color= '#f00';
} else {
document.getElementById(spanName).style.color = '#000';
}
}
</script>
<div style="text-align:center" class="title line">
<asp:TextBox onkeydown='countChar("TextBox2","counter");' onkeyup='countChar("TextBox2","counter");' ID="TextBox2" runat="server" Width="745px" MaxLength="100" Font-Size="20px" Rows="2" Height="79px" TextMode="MultiLine"></asp:TextBox>
<span id="counter">0</span>/100字
</div>
只需要多加一个span元素在textarea后面就可以了。
本文系小博客网站原创，转载请注明文章链接地址