• 类似新浪微博输入字符计数的效果


    var app = {
        //获取字符长度
        getLength: function (str) {
            var length = 0;
            if ( !! str) {
                var excStr = str.replace(/[u4E00-u9FFF]+/, "");
                var chinaLength = str.length - excStr.length;
                length = chinaLength + str.length;
            }
            return length;
        },
        //验证字符是否超过最大长度
        checkMaxLength: function (doc) {
     
            var maxLength = parseInt(doc.attr("data-maxlength")); //这个属性的值是可以输入的最大值
            var currentLength = app.getLength(doc.val());
            var tips = doc.siblings('span.wordLimit'); //显示字数的span
     
            if (currentLength > maxLength) {
                tips.text(currentLength + "/" + maxLength).css("color", "red");
                doc.text();
                return false;
            } else {
                tips.text(currentLength + "/" + maxLength).css("color", "#999");
                return true;
            }
        },
     
        init: function () {
            $('textarea[data-maxlength]').keyup(function () {
                app.checkMaxLength($(this))
            });
        }
    };
     
    app.init();

     如果需要用的话,给输入字符的textarea一个data-maxlength的属性,修改下显示计算字符的标签就可以了

  • 相关阅读:
    @topcoder
    @uoj
    Vue-路由跳转的几种方式和路由重定向
    Vue-设置默认路由选中
    Vue-使用webpack+vue-cli搭建项目
    Vue-状态管理Vuex的使用
    Vue-全局变量和方法
    JS-apply、call、bind
    CSS-禁止文本被选中
    Vue-路由模式 hash 和 history
  • 原文地址:https://www.cnblogs.com/muwei/p/4932386.html
Copyright © 2020-2023  润新知