JS簡(jiǎn)單限制textarea內(nèi)輸入字符數(shù)量的方法

更新時(shí)間：2015年10月14日 12:25:35 作者：w93223010

這篇文章主要介紹了JS簡(jiǎn)單限制textarea內(nèi)輸入字符數(shù)量的方法,涉及JavaScript響應(yīng)鼠標(biāo)及鍵盤(pán)事件處理textarea輸入框字符的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了JS簡(jiǎn)單限制textarea內(nèi)輸入字符數(shù)量的方法。分享給大家供大家參考。具體如下：

這里演示JS限制一個(gè)area內(nèi)的字符不能超過(guò)255，多余則截取。

代碼如下：

<script> 
function getStringUTFLength(str) { 
 var value = str.replace(/[\u4e00-\u9fa5]/g," ");
 //將漢字替換為兩個(gè)空格
 return value.length; 
} 
function leftUTFString(str,len) { 
 if(getStringUTFLength(str)<=len) { 
  return str; 
 }
 var value = str.substring(0,len); 
 while(getStringUTFLength(value)>len) { 
  value = value.substring(0,value.length-1); 
 } 
 return value; 
} 
function count() { 
 var len=255;
 var value = document.getElementById("licenseother").value; 
 if(getStringUTFLength(value)>=len) {  
  document.getElementById("licenseother").value = leftUTFString(document.getElementById("licenseother").value,len); 
 } 
 document.getElementById("result").value = len-getStringUTFLength(document.getElementById("licenseother").value); 
} 
</script> 
<table width="100%"> 
 <tr>
  <td> 
   <textarea cols=100 rows=4 id="licenseother" onkeypress="count()" onkeyup="count()" onblur="count();" onChange="count();"></textarea> 
  </td>
 </tr> 
 <tr>
  <td> 
   本輸入框限制輸入255個(gè)字符(漢字計(jì)算為2個(gè)字符) &nbsp;剩余字符數(shù)：
   <input readonly type="text" size="3" id="result" value="255"> 
  </td>
 </tr> 
</table>

希望本文所述對(duì)大家的JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

ele-table表格列表內(nèi)雙擊編輯部分信息的示例代碼(el-table組件同理)
本文介紹如何在ele-table組件中實(shí)現(xiàn)雙擊編輯功能,通過(guò)雙擊表格列表內(nèi)需要編輯的區(qū)域,可以展示輸入框或日期選擇器進(jìn)行數(shù)據(jù)修改,修改完成后,通過(guò)按回車(chē)鍵或點(diǎn)擊確認(rèn)按鈕提交修改數(shù)據(jù),感興趣的朋友一起看看吧
2024-11-11
純js簡(jiǎn)單日歷實(shí)現(xiàn)代碼
日歷想必大家都比較熟悉吧，實(shí)現(xiàn)的方法有很多種，在本文大家將學(xué)會(huì)到如何使用js簡(jiǎn)單實(shí)現(xiàn)日歷，感興趣的朋友可以了解下
2013-10-10
防止頁(yè)面url緩存中ajax中post請(qǐng)求的處理方法
這篇文章主要介紹了防止頁(yè)面url緩存中ajax中post請(qǐng)求的處理方式的相關(guān)資料,希望通過(guò)本文能幫助到大家，需要的朋友可以參考下
2017-10-10
詳解JavaScript邏輯And運(yùn)算符
這篇文章主要介紹了JavaScript邏輯And運(yùn)算符，在JavaScript中，邏輯 AND 運(yùn)算符用雙和號(hào)（&&）表示
2015-12-12
javascript實(shí)現(xiàn)簡(jiǎn)單倒計(jì)時(shí)效果
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)倒計(jì)時(shí)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-09-09
firefox中用javascript實(shí)現(xiàn)鼠標(biāo)位置的定位
firefox中用javascript實(shí)現(xiàn)鼠標(biāo)位置的定位...
2007-06-06
Javascript 遍歷頁(yè)面text控件詳解
本篇文章主要是對(duì)Javascript遍歷頁(yè)面text控件進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2014-01-01
js中事件的處理與瀏覽器對(duì)象示例介紹
本文為大家詳細(xì)介紹下js中關(guān)于簡(jiǎn)單事件的處理與瀏覽器對(duì)象，下面有個(gè)不錯(cuò)的示例，感興趣的朋友可以參考下
2013-11-11
input框中自動(dòng)展示當(dāng)前日期yyyy/mm/dd的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇input框中自動(dòng)展示當(dāng)前日期yyyy/mm/dd的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-07-07
javascript內(nèi)置對(duì)象Math案例總結(jié)分析
今天總結(jié)一下javascript 內(nèi)置對(duì)象Math中的函數(shù)用法，順帶寫(xiě)一下常見(jiàn)的案例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步
2022-03-03