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)及鍵盤事件處理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è)字符) 剩余字符數(shù)：
<input readonly type="text" size="3" id="result" value="255">
</td>
</tr>
</table>
希望本文所述對(duì)大家的JavaScript程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- 關(guān)于js對(duì)textarea換行符的處理方法淺析
- jsp實(shí)現(xiàn)textarea中的文字保存換行空格存到數(shù)據(jù)庫(kù)的方法
- 把textarea中字符串里含有的回車換行替換成<br>的javascript代碼
- JS給Textarea文本框添加行號(hào)的方法
- JS實(shí)現(xiàn)選擇TextArea內(nèi)文本的方法
- js監(jiān)聽(tīng)鼠標(biāo)事件控制textarea輸入字符串的個(gè)數(shù)
- JS實(shí)現(xiàn)textarea通過(guò)換行或者回車把多行數(shù)字分割成數(shù)組并且去掉數(shù)組中空的值
相關(guān)文章
ele-table表格列表內(nèi)雙擊編輯部分信息的示例代碼(el-table組件同理)
本文介紹如何在ele-table組件中實(shí)現(xiàn)雙擊編輯功能,通過(guò)雙擊表格列表內(nèi)需要編輯的區(qū)域,可以展示輸入框或日期選擇器進(jìn)行數(shù)據(jù)修改,修改完成后,通過(guò)按回車鍵或點(diǎn)擊確認(rèn)按鈕提交修改數(shù)據(jù),感興趣的朋友一起看看吧2024-11-11
日歷想必大家都比較熟悉吧，實(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)算符用雙和號(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
本篇文章主要是對(duì)Javascript遍歷頁(yè)面text控件進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-01-01
本文為大家詳細(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ù)用法，順帶寫一下常見(jiàn)的案例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步2022-03-03