<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<title>字数限制</title>
</head>
<body>
<textarea id="inputBox"></textarea>
<p>还剩下<span class="number"></span>字</p>
<script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="http://apps.bdimg.com/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
limitWordCount("#inputBox",".number",300);
function limitWordCount(editBox,numberBox,number){
//editBox 编辑框
//numberBox 字数的盒子
//number 限制字数
$(numberBox).text(number);
$(editBox).on("input propertychange",function(){
var $this=$(editBox),
_val = $this.val(),
count = "";
if(_val.length>number){
$this.val(_val.substring(0, number));
}
count=number-$this.val().length;
$(numberBox).text(count);
})
}
</script>
</body>
</html>
走过路过看一下,有什么优化的地方。
请从一下方面优化
1.代码量优化
2.逻辑上优化
3.复用性优化
欢迎大家谈论交流
点击查看更多内容
2人点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦