10,607
社区成员
发帖
与我相关
我的任务
分享textarea实用功能！谁来提供解决方案！
曾经见过某些网站有这样的功能，textarea限制输入多少字，同时旁边有一个数字，在textarea中输入时它自动动态显示还剩多少字可以输入。
我自己解决碰到这样的问题：1，textarea没有manlength属性。2，textarea的onchange事件只有当textarea失去焦点时才发生！无法实现输入的同时动态提示！3,textarea似乎没有onkeypress事件！
哪位能写出javascript代码的？多谢了！
附我的代码：
<script>
function count(){
num.innerHTML=form1.txt1.value.length
}
</script>
<body>
<form id=form1 method=post action=>
<textarea name=mytext id=txt1 maxlength=20 onchange=count() onkeypress=count()></textarea>
</form>
还剩<span id=num>10</span>
</body>
我自己解决碰到这样的问题：1，textarea没有manlength属性。2，textarea的onchange事件只有当textarea失去焦点时才发生！无法实现输入的同时动态提示！3,textarea似乎没有onkeypress事件！
哪位能写出javascript代码的？多谢了！
附我的代码：
<script>
function count(){
num.innerHTML=form1.txt1.value.length
}
</script>
<body>
<form id=form1 method=post action=>
<textarea name=mytext id=txt1 maxlength=20 onchange=count() onkeypress=count()></textarea>
</form>
还剩<span id=num>10</span>
</body>
...全文
请发表友善的回复…
发表回复
flyingghost 2002-03-30
- 打赏
- 举报
呵呵，学会了。忘记了。抱歉！^_^
结帖，给分！
结帖，给分！
ar7_top 2001-12-22
- 打赏
- 举报
给你一个例子，自己研究研究
-----------------------------------------------------------------
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" type="text/css">
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
function MM_setTextOfTextfield(objName,x,newText) { //v3.0
var obj = MM_findObj(objName);
var s=newText;
var c=s.replace(/\r\n/g, "<br>");
if (obj) obj.value = 2000-c.length;
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF">
<form name="form1" method="post" action="<wc:spxxb_add_post></wc:spxxb_add_post>">
<table width="600" border="1" align="center" bordercolorlight="#666666" bordercolordark="#666666" cellpadding="4" cellspacing="3">
<tr bgcolor="#CCFFFF">
<td nowrap valign="top">
<div align="right">商品简介：<br>
还可输入
<input type="text" name="spjj_num" size="4" maxlength="4" value="2000">
字</div>
</td>
<td nowrap valign="top">
<textarea name="spjj" cols="70" rows="8" onKeyUp="MM_setTextOfTextfield('spjj_num','',this.form.spjj.value)"></textarea>
</td>
</tr>
</table>
<br>
</form>
</body>
</html>
-----------------------------------------------------------------
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" type="text/css">
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
function MM_setTextOfTextfield(objName,x,newText) { //v3.0
var obj = MM_findObj(objName);
var s=newText;
var c=s.replace(/\r\n/g, "<br>");
if (obj) obj.value = 2000-c.length;
}
//-->
</script>
</head>
<body bgcolor="#FFFFFF">
<form name="form1" method="post" action="<wc:spxxb_add_post></wc:spxxb_add_post>">
<table width="600" border="1" align="center" bordercolorlight="#666666" bordercolordark="#666666" cellpadding="4" cellspacing="3">
<tr bgcolor="#CCFFFF">
<td nowrap valign="top">
<div align="right">商品简介：<br>
还可输入
<input type="text" name="spjj_num" size="4" maxlength="4" value="2000">
字</div>
</td>
<td nowrap valign="top">
<textarea name="spjj" cols="70" rows="8" onKeyUp="MM_setTextOfTextfield('spjj_num','',this.form.spjj.value)"></textarea>
</td>
</tr>
</table>
<br>
</form>
</body>
</html>
longj 2001-12-21
- 打赏
- 举报
有這個屬性onkeypress
<font id="font1"></font>
<textarea style="width:300;height:200"
onkeypress="document.all('font1').innerText=this.innerText.length"></textarea >
<font id="font1"></font>
<textarea style="width:300;height:200"
onkeypress="document.all('font1').innerText=this.innerText.length"></textarea >
cpplus 2001-12-21
- 打赏
- 举报
我这里测试的结果是有onkeypress这个事件的啊~，完整的代码:
<html>
<head>
<script>
var maxlength = 20 ;
function count(){
num.innerHTML=maxlength - form1.txt1.value.length ;
if((maxlength - form1.txt1.value.length) <= 0){
alert("您已经达到了最大字数！");
form1.txt1.focus();
return false;
}
}
</script>
<body>
<form id=form1 method=post action=>
<textarea name=mytext id=txt1 maxlength=20 onchange=count() onkeypress=count()></textarea>
</form>
还剩<span id=num><script>document.write(maxlength);</script></span>
</body></html>
<html>
<head>
<script>
var maxlength = 20 ;
function count(){
num.innerHTML=maxlength - form1.txt1.value.length ;
if((maxlength - form1.txt1.value.length) <= 0){
alert("您已经达到了最大字数！");
form1.txt1.focus();
return false;
}
}
</script>
<body>
<form id=form1 method=post action=>
<textarea name=mytext id=txt1 maxlength=20 onchange=count() onkeypress=count()></textarea>
</form>
还剩<span id=num><script>document.write(maxlength);</script></span>
</body></html>
