為textarea新增maxlength屬性
在<input type="text">中有自帶的maxlength屬性,使用此屬性可以設定文字框輸入字串的最大長度。textarea多行文字框並沒有這樣的屬性,下面就來介紹一下如何為為textarea文字框新增此屬性。
例項程式碼如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>為textarea新增maxlength屬性-螞蟻部落</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script type="text/javascript"> (function($){ $.fn.textarealimit=function(settings){ var newSettings={length:settings} settings=jQuery.extend({ length:20 }, newSettings); maxLength=settings.length; $(this).attr("maxlength",maxLength) .bind("keydown",doKeydown) .bind("keypress",doKeypress) .bind("beforepaste",doBeforePaste) .bind("paste",doPaste); function doKeypress() { var oTR=document.selection.createRange() if(oTR.text.length>=1){ event.returnValue=true } else if(this.value.length > maxLength-1) { event.returnValue=false } } function doKeydown() { var _obj=this; setTimeout(function() { if(_obj.value.length > maxLength-1) { var oTR=window.document.selection.createRange() oTR.moveStart("character",-1*(_obj.value.length-maxLength)) oTR.text="" } },1) } function doBeforePaste() { event.returnValue = false } function doPaste() { event.returnValue = false var oTR = document.selection.createRange() var iInsertLength = maxLength - this.value.length + oTR.text.length var sData = window.clipboardData.getData("Text").substr(0, iInsertLength) oTR.text = sData; } } })(jQuery); $(document).ready(function(){ $("#mulText").textarealimit(2); }); </script> </head> <body> <textarea id="mulText"></textarea> </body> </html>
以上程式碼實現了為多行文字框新增maxLength屬性。
相關文章
- 為textarea新增maxlength屬性程式碼例項
- maxlength和size屬性區別
- textarea多行文字域的type屬性值是textarea
- Input的size與maxlength屬性的區別
- textarea 多行文字域 type 屬性值
- 為 protocol 中屬性新增預設值Protocol
- js為物件新增和刪除屬性JS物件
- rcp新增屬性
- 為普通Object新增類似AttachedProperty的屬性Object
- javascript為html元素新增自定義屬性程式碼JavaScriptHTML
- 利用Powershell為使用者新增“登入到”屬性
- 教你在WindowsXP中為USB新增“只讀”屬性(轉)Windows
- class屬性的新增刪除
- Runtime之分類新增屬性
- css3新增屬性APICSSS3API
- JSP自定義標籤之三:為標籤新增屬性JS
- ubuntu下OpenLDAP新增自定義屬性UbuntuLDA
- css3新增哪些背景屬性CSSS3
- js給html標籤新增屬性JSHTML
- Android自定義View 屬性新增AndroidView
- 給自定義View新增xml屬性ViewXML
- 【Swift】在extension裡面新增屬性Swift
- 手撕Vue-Router-新增全域性$router屬性Vue
- iOS 用runtime為分類新增成員變數或屬性iOS變數
- shopify 屬性新增圖片及樣式
- Category新增weak屬性的精簡版本Go
- html5之新增表單屬性HTML
- html5新增及廢除屬性HTML
- Android property屬性許可權新增Android
- html5/css3新增屬性HTMLCSSS3
- Python 動態新增例項屬性,例項方法,類屬性,類方法Python
- Go語言編譯時為exe新增圖示和屬性資訊的方法Go編譯
- Runtime 系列 3-- 給 category 新增屬性Go
- HTML5表單新增元素與屬性HTML
- scss中如果將null作為屬性值會刪除此屬性CSSNull
- 在 JavaScript 中,我們能為原始型別新增一個屬性或方法嗎?JavaScript型別
- JS/JQ動態建立(新增)optgroup和option屬性JS
- javascript如何動態刪除或者新增物件屬性JavaScript物件