概述:
如下代码可以实现对文本域中字符串数量进行监控,并且可以知道已输入字符串数量和剩余字符串数量。对文本域字符串数量进行控制可以实现缓解后台数据信息量压力,下面代码其他网站也有记载,仅供参考,谢谢。
Web截图:
代码详情:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="卡布奇诺奶茶的独特">
<title>文本域字数监控</title>
</head>
<!--TEXTAREA001[css]-->
<style type="text/css">
#first{
width:200px;
height:100px;
max-width:260px;
max-height:160px;
}
</style>
<!--TEXTAREA001[js]-->
<script type="text/javascript" language="javascript">
//获取相应ID值的对象
function getID(str){
return (document.getElementById(str))?document.getElementById(str):false;
}
//键盘按下时所触发的事件
function count(){
//声明一个max表示可以输入文本框中的最大值
var max
//赋予max最大值300字符串量
max=300;
if(getID("first").value.length>max){
getID("first").value = getID("first").value.substring(0,max);
getID("used").innerHTML=0;
getID("remain").innerHTML=max;
//当输入的字符串量超额时,弹出此警示窗内容
alert("主人,您输入的字数要超额了偶!");
}else{
getID("used").innerHTML = getID("first").value.length;
getID("remain").innerHTML = max-getID("first").value.length;
}
}
</script>
<body>
<!--TEXTAREA001-->
<textarea id="first" οnkeydοwn="count()" οnkeyup="count()"></textarea>
输入:<b id="used">0</b>字 剩余:<b id="remain">0</b>字
</body>
</html>
感谢您的倾心阅读