textarea添加信息

最新推荐文章于 2023-12-05 16:28:54 发布

在路上NEXT

最新推荐文章于 2023-12-05 16:28:54 发布

阅读量1.1k

点赞数

分类专栏： html 文章标签： textareainput

html 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<div class="bd answer" id="answer-2436676727">
<div class="line info f-aid">
</div>
<div class="line content">
<pre id="best-content-2436676727" accuse="aContent" class="best-text mb-10" style="min-height: 55px;">文本框 textarea <br>限制输入文字个数的的javascript代码，我们经常在评论留言页面我们需要在客户端限制访客的留言长度，当然最好我们在<a href="https://www.baidu.com/s?wd=%E6%9C%8D%E5%8A%A1%E5%99%A8%E7%AB%AF&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1Y3Pvc1mvf4nWm3rjw-n1ck0ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EnHT4rHDYrHnkPjmYrjnYn1czPs" target="_blank" class="baidu-highlight" rel="nofollow">服务器端</a>也要加上相应的代码，因为客户端的限制是相对的。本文整理了3种限制输入字符数的方法：<br><br>方法一：文本框textarea限制输入文字个数为200个<br><br><h3>设计理念说明（200字以内）</h3> <br><textarea οnkeyup="checkLen(this)"></textarea> <br><div>您还可以输入 <span id="count">200</span> 个文字</div> <br> <br><script type="text/javascript"> <br>function checkLen(obj) <br>{ <br> var maxChars = 200;//最多字符数 <br> if (obj.value.length > maxChars) <br> obj.value = obj.value.substring(0,maxChars); <br> var curr = maxChars - obj.value.length; <br> document.getElementByIdx_x("count").innerHTML = curr.toString(); <br>} <br></script><br> [提示：你可先修改部分代码，再按运行]<br><br>方法二：显示已经用字数和剩余字数<br><br><script><br>function cal() {<br> if(a.value.length>20) {<br> a.value=a.value.slice(0,20);<br> b.value=20;<br> c.value=0;<br> }<br> else {<br> b.value=a.value.length;<br> c.value=20-eval_r(b.value);<br> }<br> }<br></script><br><textarea id="a" onpropertychange="cal()"></textarea><br>已有字数：<input id=b size=5 value="0" disabled><br>剩余字数：<input id=c size=5 value="20" disabled><br><br> [提示：你可先修改部分代码，再按运行]<br><br>方法三：支持双字节<br><br><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><br><HTML><br> <HEAD><br> <TITLE> 文本框textarea限制输入文字个数的方法 - 中国asp之家</TITLE><br> </HEAD><br> <BODY><br> <textarea οnkeyup="cls(this,50,'v')" οncοntextmenu="cls(this,50,'v')"></textarea><br> <span id="v"></span><br> <script type="text/javascript"><br> function cls(obj,max,v){<br> var reg=/[^x00-xff]/gm;<br> var str=obj.value.replace(reg,'aa');//全换成单字节字符计算<br> var v=document.getElementByIdx_x('v');<br> <br> if(str.length>max){<br> var n=0,strr=[];<br> for(var i=0;i<obj.value.length;i++){//得到50字节以内的字符<br> /[^x00-xff]/.test(obj.value.charAt(i))?n+=2:n+=1;<br> if(n>max)break;<br> strr.push(obj.value.charAt(i));<br> }<br> obj.value=strr.join('');<br> v.innerHTML=0;<br> }else{<br> v.innerHTML=max-str.length;<br> }<br> }<br> </script><br> </BODY><br></HTML><br> [提示：你可先修改部分代码，再按运行]</pre>
<div class="quality-content-view-more mb-15">
</div><div class="newbest-content-meta line mt-15 ff-arial">
<div class="ft-info grid">
<i class="i-quality-icon"></i>
本回答由网友推荐</div>
<div class="grid-r f-aid ">
<ins class="accuse-area" alog-alias="qb-accuse-link-best" style="display: none;"></ins>
<span alog-action="qb-comment-btnbestbox" class="comment f-black cursor" id="comment-2436676727"><i class="iknow-qb_home_icons i-icon-comment mr-5"></i>评论</span>
<div class="qb-zan-eva">
<span alog-action="qb-zan-btnbestbox" class="iknow-qb_home_icons evaluate evaluate-32
" id="evaluate-2436676727" data-evaluate="4"><i class="iknow-qb_home_icons i-evaluate"></i><b class="evaluate-tip" style="display:none" id="72-tip">赞</b><b class="evaluate-num evaluate-num-fixed" id="72-num">4</b></span>
<span alog-action="qb-evaluate-outer" class="iknow-qb_home_icons evaluate evaluate-bad evaluate-32
" id="evaluate-bad-2436676727" data-evaluate="0"><i class="iknow-qb_home_icons i-evaluate"></i><b class="evaluate-tip" style="display:none" id="72-bad-tip">踩</b><b class="evaluate-num evaluate-num-fixed" id="72-bad-num">0</b></span>
</div>
</div>
</div>
</div>
</div>