一、實現效果:
為了更直觀的體現用戶在文本框輸入文本時能看到自己輸入了多少字,項目中需要通過判斷提示文本框剩余可輸入字數。
html & JS:
1 <div> 2 <textarea name="content" id="content" onkeyup="javascript:checkWords(this);"
onmousedown="javascript:checkWords(this);" ></textarea> 3 </div> 4 <div> 5 還可以輸入<span style="font-family: Georgia; font-size: 26px;" id="wordCheck">80</span>個漢字 6 </div> 7 8 <script> 9 var maxstrlen=80; 10 function Q(s){ 11 return document.getElementById(s); 12 } 13 function checkWords(c){ 14 len=maxstrlen; 15 var str = c.value; 16 myLen = getStrleng(str); 17 var wck=Q("wordCheck"); 18 if(myLen>len*2){ 19 c.value=str.substring(0,i+1); 20 }else{ 21 wck.innerHTML = Math.floor((len*2-myLen)/2); 22 } 23 } 24 function getStrleng(str){ 25 myLen = 0; 26 i = 0; 27 for(;(i<str.length)&&(myLen<=maxstrlen*2);i++){ 28 if(str.charCodeAt(i)>0&&str.charCodeAt(i)<128) 29 myLen++; 30 else 31 myLen+=2; 32 } 33 return myLen; 34 }
以上可以動態判斷文本框可輸入剩余字數,資料來自網絡。