input输入框限制输入字节数

在网页展示中经常会碰到,标题过长,需要截取字符串,用CSS的实现的话各种兼容问题,各种坑

下面解决的是在输入框输人最多10个汉字20个英文的问题


 //监控键盘事件
        var matchWords = 0;
        priceTbWrap.delegate('input[name = "costName"]', 'input propertychange', function () {
            if(utils.getLength($(this).val())<=20){
                matchWords = $(this).val().trim().length;
            }
            if(utils.getLength($(this).val()) > 20){
                $(this).val($(this).val().trim().substr(0,matchWords));
                return false;
            }
        });

当时想到的是用键盘事件可是遇到下面的问题
因为第三方输入法在输入拼音的时候并没有把你输入的字幕写在输入框内,而是在输入法上部暂存,


下面是获取字符串字节数的方法


/**
     * 获得字符串实际长度,中文2,英文1 要获得长度的字符串
     */
    getLength : function(str) {
        var realLength = 0, len = str.length, charCode = -1;
        for ( var i = 0; i < len; i++) {
            charCode = str.charCodeAt(i);
            if (charCode >= 0 && charCode <= 128)
                realLength += 1;
            else
                realLength += 2;
        }
        return realLength;
    },


你可能感兴趣的:(前端进阶之路)