textarea的输入限制统计代码statInput

作者:mudoo 来源:经典论坛时间:2008-5-22 网友评论条【大中小】

首先.还是看效果.

实现对文本域textarea中文字字数的限制。

然后.米了...看文件.里面写的很清楚了.

下面这个是单独的效果..提示用alert的.有点烦人...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns:mudoo> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>statInput 输入限制统计 - 中国asp之家</title> <style type="text/css">  </style> <script language="javascript" type="text/javascript">  </script> <script language="javascript" type="text/javascript">  </script> <script language="javascript" type="text/javascript">  </script> </head> <body> <div class="case"> <div class="title"><a href="#" class="r">Top</a>statInput 调用方法</div> <div class="b">statInput(Element, MaxLen, {objMax, objTotal, objLeft, Hint});</div> <ul class="info gray"> <li><span class="key">Element：</span><span class="type">Object</span>限制统计对象 (*必须)</li> <li><span class="key">MaxLen：</span><span class="type">Number</span>最大可输入长度 (*必须)</li> <li><span class="key">objMax：</span><span class="type">Object</span>显示最大输入长度对象 (*可选)</li> <li><span class="key">objTotal：</span><span class="type">Object</span>显示输入统计对象 (*可选)</li> <li><span class="key">objLeft：</span><span class="type">Object</span>显示可输入长度对象 (*可选)</li> <li><span class="key">Hint：</span><span class="type">Boolean</span>当长度超出上限时，是否提示 (*可选)</li> </ul> </div> <div class="case"> <div class="title"><a href="#" class="r">Top</a>statInput 演示</div> <textarea name="Test_1" id="Test_1" rows="10" style="width: 99%" >悟空你也太调皮了，我跟你说过，叫你不要乱扔东西，乱扔东西这么做…… （咣当，悟空棍子掉在地上）你看我还没有说完呢你把棍子又给扔掉了！月光宝盒是宝物，你把他扔掉会污染环境，唉，要是砸到小朋友那怎么办？就算没有砸到小朋友砸到那些花花草草也是不对的呀！</textarea> <div class="gray">最多可输入<span id="stat_max" class="b light"></span>，当前共<span id="stat_total" class="b light"></span>，还可输入<span id="stat_left" class="b light"></span></div> </div> </body> </html> [提示：你可先修改部分代码，再按运行]

这个提示用popHint.嗯.这样才帅~`.哈哈哈~.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns:mudoo> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>POPHint & statInput 整合效果 - 中国asp之家</title> <style type="text/css">  </style> <script language="javascript" type="text/javascript">  </script> <script language="javascript" type="text/javascript">  </script> <script language="javascript" type="text/javascript">  </script> </head> <body> <div class="case"> <div class="title"><a href="#" class="r">Top</a>statInput 调用方法</div> <div class="b">statInput(Element, MaxLen, {objMax, objTotal, objLeft, Hint});</div> <ul class="info gray"> <li><span class="key">Element：</span><span class="type">Object</span>限制统计对象 (*必须)</li> <li><span class="key">MaxLen：</span><span class="type">Number</span>最大可输入长度 (*必须)</li> <li><span class="key">objMax：</span><span class="type">Object</span>显示最大输入长度对象 (*可选)</li> <li><span class="key">objTotal：</span><span class="type">Object</span>显示输入统计对象 (*可选)</li> <li><span class="key">objLeft：</span><span class="type">Object</span>显示可输入长度对象 (*可选)</li> <li><span class="key">Hint：</span><span class="type">Boolean</span>当长度超出上限时，是否提示 (*可选)</li> </ul> </div> <div class="case"> <div class="title"><a href="#" class="r">Top</a>statInput 演示</div> <textarea name="Test_1" id="Test_1" rows="10" style="width: 99%" >悟空你也太调皮了，我跟你说过，叫你不要乱扔东西，乱扔东西这么做…… （咣当，悟空棍子掉在地上）你看我还没有说完呢你把棍子又给扔掉了！月光宝盒是宝物，你把他扔掉会污染环境，唉，要是砸到小朋友那怎么办？就算没有砸到小朋友砸到那些花花草草也是不对的呀！</textarea> <div class="gray">最多可输入<span id="stat_max" class="b light"></span>，当前共<span id="stat_total" class="b light"></span>，还可输入<span id="stat_left" class="b light"></span></div> </div> <br /> <br /> <br /> <br /> <br /> <div class="case"> <div class="title"><a href="#" class="r">Top</a>popHint 调用方法(目前只支持单行)</div> <div class="b">popHint(Element, Hint, {Type, Event});</div> <ul class="info gray"> <li><span class="key">Element：</span><span class="type">Object</span>弹出对象。根据它来定位的。  (*必须)</li> <li><span class="key">Hint：</span><span class="type">String</span>弹出的信息，支持HTML可是不能换行。  (*必须)</li> <li><span class="key">Type：</span><span class="type">String</span>弹出类型。其实说类型是不对的。只是定义个图标而已...(可自己在样式里加很多很多"类型")  (*可选)</li> <li><span class="key">Event：</span><span class="type">String</span>关闭触发事件。目前只能绑定单个事件(默认click=document.onmousedown,blur=Element.onblur)  (*可选)</li> </ul> <br /><span style="color: #333333" class="b">详见：<a href="http://bbs.blueidea.com/thread-2856572-1-1.html" target="_blank" >http://bbs.blueidea.com/thread-2856572-1-1.html</a></span> </div> <div class="case"> <div class="title"><a href="#" class="r">Top</a>popHint 演示</div> <ul class="demo gray"> <li>测试blur不关闭：<input name="Test1_0" id="Test1_0" type="text" size="20" maxlength="20" onfocus="popHint(this, '失去焦点不会关闭提示.按TAB键看看');" value="" /> <a href="###"> </a></li> <li>测试blur关闭：<input name="Test1_1" id="Test1_1" type="text" size="20" maxlength="20" onfocus="popHint(this, '文本框失去焦点就关闭.', {_event : 'blur'});" value="" /></li> </ul> <ul class="demo gray"> <li>Test2：<input name="Test2" id="Test2" type="text" size="20" maxlength="20" value="" /></li> <li>Test3：<input name="Test3" id="Test3" type="text" size="20" maxlength="20" value="" /></li> <li>Test4：<input name="Test4" id="Test4" type="hidden" size="20" maxlength="20" value="" /></li> <li>Test5：<input name="Test5" id="Test5" type="text" size="20" maxlength="20" value="" style="display:none" /></li> <li><input name="" type="button" onclick="testPopHint();" value="来测试啦" /></li> </ul> </div> </body> </html> [提示：你可先修改部分代码，再按运行]

【加入收藏】【报告错误】【投递文章】【复制地址】【返回顶部↑】

本文地址：http://www.aspxhome.com/javascript/jsmagic/20085/382322.htm

站长工具

textarea的输入限制统计代码statInput

Aspxhome.com. 中国Asp之家. 版权所有