全角和半角混合文本的字符长度计算

序言

程序前台页面中，经常有一些有输入长度限制的input和textarea，限制长度的方法有标签上加入maxlength属性和使用js的length属性获取输入的内容长度。
以上的方法适用于大多数情况，但需求更复杂一些，比如输入框中最多输入10个全角文字或20个半角文字，即只能输入10个汉字或者20个英文数字。这时length属性就变得不适用。

解决方法

将输入的字符转为Unicode编码，根据编码来判断哪些是全角字符（对应length+=2），哪些是半角字符（对应length+=1）。

js版本

/**
 * 全角文字的长度
 * @param 输入文字
 * @return 文字长度
 */
function getMojiLength(str) {

    var realLength = 0;
    var len        = str.length;
    var charCode   = -1;

    for ( var i = 0; i < len; i++) {
        charCode = str.charCodeAt(i);

        if (charCode >= 0 && charCode <= 254) {
            // 0-255中的全角文字，依次对应下面的字符
            // ¢ , £ , § , ¨ , « , ¬ , ¯ , ° , ± , ´ , µ , ¶ , · , ¸ , » , × , ÷
            if (charCode == 162
                    || charCode == 163
                    || charCode == 167
                    || charCode == 168
                    || charCode == 171
                    || charCode == 172
                    || charCode == 175
                    || charCode == 176
                    || charCode == 177
                    || charCode == 180
                    || charCode == 181
                    || charCode == 182
                    || charCode == 183
                    || charCode == 184
                    || charCode == 187
                    || charCode == 215
                    || charCode == 247) {
                realLength += 2;
            } else {
                realLength += 1;
            }
        } else if (charCode >= 65377 && charCode <= 65439) {
            if (charCode == 65381) { // '･'该字符的长度为两个字节
                realLength += 2;
            } else {
                realLength += 1;
            }
        } else {
            realLength += 2;
        }
    }
    return realLength;
}

Java版本

 /**
     * 取得文字的长度
     * @param moji 输入文字
     * @return 长度
     */
    public static int getMojiLength(String moji) {
        if (isEmpty(moji)) {
            return 0;
        }

        char charCode;
        int mojiLen = 0;
        for (int i = 0; i < moji.length(); i++) {
            charCode = moji.charAt(i);
            if (charCode >= 0 && charCode <= 254) {
                // 0-255中的全角文字
                if (charCode == 162
                        || charCode == 163
                        || charCode == 167
                        || charCode == 168
                        || charCode == 171
                        || charCode == 172
                        || charCode == 175
                        || charCode == 176
                        || charCode == 177
                        || charCode == 180
                        || charCode == 181
                        || charCode == 182
                        || charCode == 183
                        || charCode == 184
                        || charCode == 187
                        || charCode == 215
                        || charCode == 247) {
                    mojiLen += 2;
                } else {
                    mojiLen += 1;
                }
            } else if (charCode >= 65377 && charCode <= 65439) {
                if (charCode == 65381) {
                    mojiLen += 2;
                } else {
                    mojiLen += 1;
                }
            } else {
                mojiLen += 2;
            }
        }
        return mojiLen;
    }

说明

以上的代码思路是先将问字符转为Unicode编码，先判断是否属于0-255范围内，除了几个特殊的字符是两个字节，其他为一个字节。接着判断65377-65439范围内的长度，65381（对应‘･’字符，占两个字节），其余是一个字节，除此之外范围内的字符都是两个字节。

补充

根据Unicode编码获取对应汉字的方法，js为fromCharCode()

var char = "";
var codeArray = [162,163,167,168,171,172,175,176,177,180,181,182,183,184,187,215,247];
for(var i=0; i<codeArray.length; i++){
   char += String.fromCharCode(codeArray[i]) + " , ";
}
//char =  ¢ , £ , § , ¨ , « , ¬ , ¯ , ° , ± , ´ , µ , ¶ , · , ¸ , » , × , ÷

Java写法更为简单

int charCode = 162;
String charValue = "" + (char)charCode;
// charValue = ¢

以上介绍的方法还有其他用途，比如文本框中动态追加内容时，要进行合理的换行（两段的内容长度小于文本框长度，则显示在同一行，若超出则换行显示），因为汉字占得位置比较字母数字大，不能根据文字长度来判断，这时就可以计算文字的真实长度来判断是否换行。