zoukankan      html  css  js  c++  java
  • js对输入文字个数的限制...

    发表留言或者微博的时候,对输入文字个数的限制,下面分两种情况,每种分别介绍两种实现方式:

    第一种:一个汉字算一位,两个字母或符号算一位。

    通过ASCII编码来判断

    textarea.onkeyup = function(){  
        //[^x00-xff]即ASCII编码不在0-255的字符,也就是汉子了,先把所有汉子换成任意两个字符,最后除以2,得到一个字符  
        var n = 150- Math.floor(this.value.replace(/[^x00-xff]/g,"aa").length/2)  
        span.innerHTML = n <=0 ? 0 : n;   
    };  

    通过charCodeAt编码来判断

    //键盘up的时候判断  
    textarea.onkeyup = function(){  
        var n = 1  ; //字母或符号累加判断  
        var num = 0;  //总个数累加判断  
        for (var i = 0; i < this.value.length; i++) {  
            //根据charCodeAt来判断输入的是中文还是字母,符号    
            charCode = this.value.charCodeAt(i);    
            if (charCode >= 0 && charCode <= 128){  
                //通过n模2来判断输入两次累加  
                n++;  
                if(n%2 == 0) num += 1;  
            }else{  
                num += 1;    
            }     
        };    
        span.innerHTML = 150-num <=0 ? 0 : 150-num;  
    };  

    另一种:是一个汉字算两位,一个字母或者符号算一位

    通过ASCII编码来判断

    textarea.onkeyup = function(){  
        //[^x00-xff]即ASCII编码不在0-255的字符,也就是汉子了,先把所有汉子换成任意两个字符  
        var n = 150- this.value.replace(/[^x00-xff]/g,"aa").length  
        span.innerHTML = n <=0 ? 0 : n;   
    };  

    通过charCodeAt编码来判断

    //键盘up的时候判断  
    textarea.onkeyup = function(){  
        var num = 0;  //总个数累加判断  
        for (var i = 0; i < this.value.length; i++) {  
            //根据charCodeAt来判断输入的是中文还是字母,符号    
            charCode = this.value.charCodeAt(i);    
            if (charCode >= 0 && charCode <= 128){  
                //字符就+1  
                num += 1;  
            }else{  
                //汉子就+2  
                num += 2;    
            }     
        };    
        span.innerHTML = 150-num <=0 ? 0 : 150-num;  
    };  
  • 相关阅读:
    删除List集合中的元素你碰到过这样的陷阱吗?
    从spring框架中的事件驱动模型出发,优化实际应用开发代码
    SpringBoot启动原理及相关流程
    基于SpringBoot实现定时任务的设置(常用:定时清理数据库)
    C#开发中常用的加密解密方法
    http://go.microsoft.com/fwlink/?linkid问题
    移动端开发必须知道的小技巧
    工作中遇到的细节问题总结(二)
    redis分布式锁和消息队列
    join和wait
  • 原文地址:https://www.cnblogs.com/qianduanjingying/p/5455078.html
Copyright © 2011-2022 走看看