完美兼容實現:解決textarea輸入框限制字數長度(帶統計功能)


extarea稱文本域【文本區】,即有滾動條的多行文本輸入控件,在網頁的提交表單中經常用到。textarea有maxlength屬性,但是textarea不兼容ie8/9。如何實現textarea輸入框限制字數長度的兼容問題呢?

 

通常的做法就是使用JavaScript腳本語言來實現對textarea文本域的字數輸入限制,主要思路就是先定義一個顯示區域,創建鍵盤事件(onkeyup或onkeydown),利用函數統計字數,判斷后再顯示。

 

實現代碼如下:

html:

<textarea id="contents" rows="3"  maxlength="20" 
	onchange="sizecontrol()" onkeydown="sizecontrol()" onkeyup="sizecontrol()" 
></textarea> 
<span id="ts">已輸入字符: </span></p>

  

js:

<script>
var maxl=20//總長  
function sizecontrol(){  
	var contents=document.getElementById("contents"),
		ts=document.getElementById("ts"),
   		len=contents.value.length;  
   	if(len>maxl){
   		contents.value=contents.value.substr(0,maxl)
   	}else{
   		ts.innerhtml="已輸入:"+len+"/"+maxl+" 字符"
   	} 
}  
</script>

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM