JS统计文本框字符串，并实时显示剩下字符数，效果如本博客评论字数限制效果，在这里共享一下，在上传文 字作品的时候，我相信这会在用户体验上有一个不错的效果。
代码比较简单：
JavaScript代码01
| 代码如下 | 复制代码 |
| .<script language="JavaScript"> <!--// function textCounter(field, countfield, maxlimit) { // 定义函数，传入3个参数，分别为表单区的名字，表单域元素名，字符限制； if (field.value.length > maxlimit) //如果元素区字符数大于最大字符数，按照最大字符数截断； field.value = field.value.substring(0, maxlimit); else //在记数区文本框内显示剩余的字符数； countfield.value = maxlimit - field.value.length; } //--> </script> |
|
完整实例
| 代码如下 | 复制代码 |
|
<table border="0" cellpadding="0" style="border-style:solid; border-width:1px; padding:1px; border-collapse: collapse" bordercolor="#CCCCCC" width="100%" height="184"> <form action="return1_w.php" method="POST" target="_blank" style="margin:0px; padding:0px;"> <tr> <td width="96" height="20"><div align="right" style="font-size:12px">用户名：</div></td> <td height="20"> <input readonly="readonly" type="text" name="remLen" size="4" maxlength="3" value="150" /> 个字符(可以在这里给我评论或建议哦^_^)</td> </tr> <tr> <td width="96" height="71"><script language="JavaScript"> <!--// function textCounter(field, countfield, maxlimit) { // 定义函数，传入3个参数，分别为表单区的名字，表单域元素名，字符限制； if (field.value.length > maxlimit) //如果元素区字符数大于最大字符数，按照最大字符数截断； field.value = field.value.substring(0, maxlimit); else //在记数区文本框内显示剩余的字符数； countfield.value = maxlimit - field.value.length; } //--> </script> <div align="right" style="font-size:12px">回复内容：</div></td> <td width="396" height="71"><textarea rows="4" name="neirong" cols="50" onKeyDown="textCounter(this.form.neirong,this.form.remLen,150);" onkeyup="textCounter(this.form.neirong,this.form.remLen,150);"> </textarea></td> </tr> <tr> <td height="30" colspan="2"><div align="center"> <input type="submit" value="发布" name="hf" /> </div></td> </tr> <tr> <td colspan="2"><table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%"> <tr> <td width="100%" height="1" colspan="4"></td> </tr> </table></td> </tr> </form> </table> |
|
时间： 2024-09-30 19:18:01