《基于js实现textarea中获取动态剩余字数的方法.doc》由会员分享，可在线阅读，更多相关《基于js实现textarea中获取动态剩余字数的方法.doc（4页珍藏版）》请在金锄头文库上搜索。
1、基于JS实现textarea中获取动态剩余字数的方法这篇文章主要介绍了基于JS实现textarea中获取动态剩余字数的方法的相关资料，非常不错，具有参考借鉴价值，感兴趣的朋友一起看看吧案例介绍：我们常见到有的网站有textarea文本框，当你输入的时候，下面有文字提示还能输入多少个字，今天就是要实现这个功能。当然，由于一个页面有好几个textarea，所以使用单个js逻辑进行控制是不行的，得小小的进行封装一下。当然我的封装还有缺漏，但是基本功能是实现了。首先介绍下单个textarea实现案例html部分：剩余可输入600字js部分：$(function $(#text_txt1).on(key
2、up,function var txtval = $(#text_txt1).val .length;console.log(txtval);var str = parseInt(600-txtval);console.log(str);if(str 0 )$(#num_txt1).html(剩余可输入+str+字);else$(#num_txt1).html(剩余可输入0字);$(#text_txt1).val($(#text_txt1).val .substring(0,600); /这里意思是当里面的文字小于等于0的时候，那么字数不能再增加，只能是600个字/console.log($(
3、#num_txt).html(str););)然后介绍同页面下多个textarea实现案例function changeLength(obj,num)obj.on(keyup,function var txtval = obj.val .length;/console.log(txtval);var str = parseInt(600-txtval);/console.log(str);if(str 0 )num.html(剩余可输入+str+字);else num.html(剩余可输入0字);obj.val(obj.val .substring(0, 600);/console.log($
4、(#num_txt).html(str););$(function /我这里有四个，所以调用4次changeLength($(#text_txt1),$(#num_txt1);changeLength($(#text_txt2),$(#num_txt2);changeLength($(#text_txt3),$(#num_txt3);changeLength($(#text_txt4),$(#num_txt4););当然这里面实际上要求的字数也可以封装在函数内部，不过我就不封装了。这样就实现了当输入文字的时候，span内部会自动显示剩余字数，当输入值达最高值时，显示剩余字数为0，且无法在新填入
5、内容。当删除文字的时候，span又能动态获取剩余字数。下面上下别人的代码，这次多少也借鉴了别人的写法html:简介：onkeyup=changeLength(this,60) class=nicknameBox_v2 brief_box_v260js:/验证textarea的长度function changeLength(obj,lg)var len = $(obj).val ;$(obj).next .find(h3).text(lg-len.length);if(len.length=lg)$(obj).next .find(h3).text(0);$(obj).val(len.substring(0,lg);以上所述是给大家介绍的基于JS实现textarea中获取动态剩余字数的方法，希望对大家有所帮助
