正则表达式实现 限制文字输入个数汉子,数字,英文单词

版权声明: https://blog.csdn.net/weixin_38500689/article/details/79580878

html:

<textarea style=" height: 60px;"  check="required" id='limitNum' onkeyup="words_deal();"></textarea>
<p class='syNum'>剩余<span id="textCount">20</span>个字</p> 

js:

var valDom = document.getElementById("limitNum");
var numDom = document.getElementById("textCount");
var zLen;
function words_deal(){
    	zLen = 20;//最多允许输入20个字,每个英文单词算一个,标点不计算个数
        var str = valDom.value;//获取文本域的值
        //判断是否包含中文:if(/^[\u4e00-\u9fa5]/.test("名字"))        
        var regH = /^[\u4e00-\u9fa5]/;//汉字
        var regY = /^[a-zA-Z]/;//英文
        var regN=/\d/g;//数字
        var regK=/\s/g;//空格
        var regZ=/./g;//总长
        //var lenN=str.match(regN).length;
       // var lenK=str.match(regK).length;
       // var lenZ=str.match(regZ).length;
       // var lenH = str.match(regH).length;
        var strlen = str.length;
        if(strlen > 0){//如果字符串长度大于0
            for(var i=0;i<strlen;i++){//遍历字符串
                var strIndex = str.charAt(i);//获取for循环当前字符
                if(regY.test(strIndex)){//判断是否为英文,英文以单词为单位,不是以英文字母
                    if(i+1<=strlen){
                        var strNext = str.charAt(i+1);
                        if(!regY.test(strNext)){
                            //如果下一个不是英文
                            zLen--;
                            if(zLen<=0){//达到字数限制
                                limitNum(i,str);
                                return false;
                            }
                        }
                    }else{
                        //最后一个字符
                        zLen--;
                        if(zLen<=0){
                            limitNum(i,str);
                            return false;
                        }

                    }
                }else{
                    //var kflag = regK.test(strIndex);
                    var hflag = regH.test(strIndex);//汉子
                    var nflag = regN.test(strIndex);//数字
                    if(hflag || nflag){
                        zLen--;
                        if(zLen<=0){
                            limitNum(i,str);
                            return false;
                        }
                    }
                }
            }
            numDom.innerText=zLen;
        } else{
            numDom.innerText='20';
        }

    }

超出字数限制的处理

    function limitNum(i,str){
        var newStr = str.substr(0, i+1);//此处不能截取 0,19.因为存在英文单词或者标点
        valDom.value = newStr;
        numDom.innerText=0;
    }
总结:主要是英文单词的判断,一般英文单词与单词之间会存在空格,所以判断一个英文单词是否结束,就是找到他的下一个字符是否是英文单词。如果是那么不做处理继续遍历下一个。其次是正则表达式的利用,可以百度的。再有就是字符串的遍历方法


猜你喜欢

转载自blog.csdn.net/weixin_38500689/article/details/79580878