完美兼容实现:解决textarea输入框限制字数长度(带统计功能)
extarea称文本域【文本区】,即有滚动条的多行文本输入控件,在网页的提交表单中经常用到。textarea有maxlength属性,但是textarea不兼容ie8/9。如何实现textarea输入框限制字数长度的兼容问题呢?
通常的做法就是使用JavaScript脚本语言来实现对textarea文本域的字数输入限制,主要思路就是先定义一个显示区域,创建键盘事件(onkeyup或onkeydown),利用函数统计字数,判断后再显示。
实现代码如下:
html:
<textarea id="contents" rows="3" maxlength="20"
onchange="sizecontrol()" onkeydown="sizecontrol()" onkeyup="sizecontrol()"
></textarea>
<span id="ts">已输入字符: </span></p>js:
<script>
var maxl=20//总长
function sizecontrol(){
var contents=document.getElementById("contents"),
ts=document.getElementById("ts"),
len=contents.value.length;
if(len>maxl){
contents.value=contents.value.substr(0,maxl)
}else{
ts.innerHTML="已输入:"+len+"/"+maxl+" 字符"
}
}
</script>本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!