JS显示剩余字数(TextArea写法)

最新推荐文章于 2024-08-09 15:51:34 发布

rembo

最新推荐文章于 2024-08-09 15:51:34 发布

阅读量509

点赞数

分类专栏： HTML 文章标签： JAVASCRIPT ViewUI

本文链接：https://blog.youkuaiyun.com/rembo/article/details/84465599

版权

HTML 专栏收录该内容

3 篇文章

订阅专栏

<html>
<body>
<h2>测试剩余字数</h2>
<textarea id="inputword"></textarea>
<input type="text" id="lastwordnum" value="10">
</body>
<script type="text/javascript">
var textareaobj=document.getElementById('inputword');
textareaobj.οnkeydοwn=function(){
checklastword();
}

textareaobj.οnkeyup=function(){
checklastword();
}

function checklastword(){
var lastwordnum=10-textareaobj.value.length;
if(lastwordnum>=0) document.getElementById('lastwordnum').value=lastwordnum;
if(lastwordnum < 1) textareaobj.value= textareaobj.value.substr(0,10);
}//test
</script>
</html>

自己写的一个js检测剩余字数的方法，最近一个项目中用到，仅供参考，如需封装或是中文和英文显示字数不同可以自己扩展。

主要用了keydown和keyup两个事件同时绑定的方法，比较简单易行。复杂一点的检测剩余字数控件可以去新浪微博找。