首頁手記 JQuery輸入框字數限制

JQuery輸入框字數限制

標簽：

JQuery

<!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.复用性优化
欢迎大家谈论交流

點擊查看更多內容