先根据需求把样式写好
image.png
<div class="intro">
<div class="f_head">简介:</div>
<div>
<textarea name="intro" id="intro" cols="45" rows="6" style="resize:none" maxlength="50"></textarea>
<p class="number_hint">
<span id="b">0</span>
<span id="c">/50</span>
</p>
<p class="erro_s">简介内容5~50个字符之间</p>
</div>
</div>
$("#intro").keyup(function() {
if (intro.value.length > 50) {
intro.value = intro.value.slice(0, 50);
$("#b").html("50");
$("#c").html("0");
} else {
$("#b").html(intro.value.length + "/");
$("#c").html(50 - parseInt($("#b").html()));
}
});
在其他JS框架中就更简单了，有数据绑定
<textarea id="message " rows="3 " [(ngModel)]="item.message " maxlength="150"
(keyup)="checkTextarea(item.message)"></textarea>
<span class="textarea__count">{{item.message?.length}}/150</span>
