100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > HTML5统计字数功能 js实现多行文本框统计剩余字数功能

HTML5统计字数功能 js实现多行文本框统计剩余字数功能

时间:2019-07-15 01:34:07

相关推荐

HTML5统计字数功能 js实现多行文本框统计剩余字数功能

效果图:

代码如下:

js统计文本框剩余字数

#area{

width: 300px;

height: 300px;

resize:none;

}

你还可以输入:10个字

function sy() {

var num=document.getElementById("area").value.length;

//console.log(num);

var sheng=10-num;

if(sheng==0){

//变颜色为红色

console.log(sheng);

document.getElementById("span").style.color="#ff0000";

}else{

//变颜色为黑色

document.getElementById("span").style.color="#000000";

}

document.getElementById("span").innerHTML=sheng;

}

function fun(){

var txt=document.getElementById("area").value;

//这么写的意思是申请abc三个值都为0

var a=b=c=0;

for(var i=0;i

var ch=txt.charAt(i);

if(ch>="a"&&ch<="z"){

a++;

}else if(ch>="A"&&ch<="Z"){

b++;

}else if(ch>="0"&&ch<="9"){

c++;

}

}

//abc中分别统计了小写字母、大写字母、数字的个数

document.getElementById("div").innerHTML="大写字母有"+b+"个,小写字母有"+a+"个,数字有"+c+"个";

}

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。