日期:2014-05-16 浏览次数:20419 次
<html> <head> <title>enter</title> <script language="javascript"> function keypress1() //text输入长度处理 { var text1=document.getElementById("mytext1").value; var len=15-text1.length; var show="你还可以输入"+len+"个字"; document.getElementById("name").innerText=show; } function keypress2() //textarea输入长度处理 { var text1=document.getElementById("myarea").value; var len;//记录剩余字符串的长度 if(text1.length>=300)//textarea控件不能用maxlength属性,就通过这样显示输入字符数了 { document.getElementById("myarea").value=text1.substr(0,300); len=0; } else { len=300-text1.length; } var show="你还可以输入"+len+"个字"; document.getElementById("pinglun").innerText=show; } </script> </head> <body> <center> <div style="text-align:left;"> <h>昵称:</h> <input type="text" id="mytext1" maxlength=15 onKeyUp="keypress1()"/> <font color="gray"><label id="name">你还可以输入15个字</label></font> <br> <h>评论内容:</h><br> <textarea id="myarea" style="height:100px;width:200px;overflow-x:hidden;overflow-y:hidden" onKeyUp="keypress2()" onblur="keypress2()"></textarea> <font color="gray"><label id="pinglun">你还可以输入300个字</label></font> <div> </center> </body> </html>
------解决方案--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>enter</title> <script language="javascript"> function keypress2() //textarea输入长度处理 { var text1 = document.getElementById("myarea").value; var len; //记录剩余字符串的长度 if (text1.length >= 300)//textarea控件不能用maxlength属性,就通过这样显示输入字符数了 { document.getElementById("myarea").value = text1.substr(0, 300); len = 0; } else { len = 300 - text1.length; } var show = "你还可以输入" + len + "个字"; document.getElementById("pinglun").innerText = show; } </script> </head> <body> <center> <div style="text-align:left;"> <h>评论内容:</h><br> <textarea id="myarea" style="height:100px;width:200px;overflow-x:hidden;overflow-y:hidden" onKeyUp="keypress2()" onblur="keypress2()"></textarea> <font color="gray"><label id="pinglun">你还可以输入300个字</label></font> <div> </center> </body> </html>