首頁 JS特效 jQuery特效 jQuery textarea文字方塊輸入文字字數限制提示代碼

jQuery textarea文字方塊輸入文字字數限制提示代碼

jQuery textarea文字方塊輸入文字字數限制提示代碼

jQuery textarea文字方塊輸入文字字數限制提示代碼

js程式碼

<script type="text/javascript">
    //顯示限制輸入字元method
    function textAreaChange(obj){
        var $this = $(obj);
        var count_total = $this.next().children('span').text();
        var count_input = $this.next().children('em');
        var area_val = $this.val();
        if(area_val.len()>count_total){
            area_val = autoAddEllipsis(area_val,count_total);//根據位元組截圖內容
            $this.val(area_val);
            count_input.text(0);//顯示可輸入數
        }else{
            count_input.text(count_total - area_val.len());//顯示可輸入數
        }
    }
    //得到字串的位元組長度
    String.prototype.len = function(){
        return this.replace(/[^\x00-\xff]/g, "xx").length;
    };
    /*
     * 處理過長的字串,截取並添加省略號
     * 註:半角長度為1,全角長度為2
     * pStr:字串
     * pLen:截取長度
     * return: 截取後的字串
     */
    function autoAddEllipsis(pStr, pLen) {
        var _ret = cutString(pStr, pLen);
        var _cutFlag = _ret.cutflag;
        var _cutStringn = _ret.cutstring;
        return _cutStringn;
    }
    /*
     * 取得指定長度的字串
     * 註:半角長度為1,全角長度為2
     * pStr:字串
     * pLen:截取長度
     * return: 截取後的字串
     */
    function cutString(pStr, pLen) {
        // 原始字串長度
        var _strLen = pStr.length;
        var _tmpCode;
        var _cutString;
        // 預設情況下,傳回的字串是原始字串的一部分
        var _cutFlag = "1";
        var _lenCount = 0;
        var _ret = false;
        if (_strLen <= pLen/2){_cutString = pStr;_ret = true;}
        if (!_ret){
            for (var i = 0; i < _strLen ; i++ ){
                if (isFull(pStr.charAt(i))){_lenCount += 2;}
                else {_lenCount += 1;}
                if (_lenCount > pLen){_cutString = pStr.substring(0, i);_ret = true;break;}
                else if(_lenCount == pLen){_cutString = pStr.substring(0, i + 1);_ret = true;break;}
            }
        }
        if (!_ret){_cutString = pStr;_ret = true;}
        if (_cutString.length == _strLen){_cutFlag = "0";}
        return {"cutstring":_cutString, "cutflag":_cutFlag};
    }
    /*
     * 判斷是否為全角
     *
     * pChar:長度為1的字串
     * return: true:全角
     * false:半角
     */
    function isFull (pChar){
        if((pChar.charCodeAt(0) > 128)){return true;}
        else{return false;}
    }
</script>
jQuery textarea文字框輸入文字字數限制提示代碼,設定固定輸入字符,即時計算顯示已經輸入多少字符。  

免責聲明

本站所有資源皆由網友貢獻或各大下載網站轉載。請自行檢查軟體的完整性!本站所有資源僅供學習參考。請不要將它們用於商業目的。否則,一切後果都由您負責!如有侵權,請聯絡我們刪除。聯絡方式:admin@php.cn

相關文章

html代碼文字方塊限制輸入 文字方塊變灰色 限製文字方塊輸入 html代碼文字方塊限制輸入 文字方塊變灰色 限製文字方塊輸入

01 Mar 2017

這篇文章主要介紹了html代碼文字框限制輸入、文字框變灰色、限製文字框輸入,需要的朋友可以參考下

jQuery實作限制textarea文字方塊輸入字元數量的方法_jquery jQuery實作限制textarea文字方塊輸入字元數量的方法_jquery

16 May 2016

這篇文章主要介紹了jQuery實現限制textarea文字方塊輸入字元數量的方法,涉及jQuery鍵盤事件及頁面元素的相關操作技巧,需要的朋友可以參考下

jquery限定文字方塊只能輸入數字即整數和小數_jquery jquery限定文字方塊只能輸入數字即整數和小數_jquery

16 May 2016

限定文字方塊只能輸入數字即整數和小數,在某些特殊情況下還是比較實用的,下面有個不錯的範例,透過jquery來簡單實作下

html代碼文字方塊限制輸入 文字方塊變灰色 限製文字方塊輸入_HTML/Xhtml_網頁製作 html代碼文字方塊限制輸入 文字方塊變灰色 限製文字方塊輸入_HTML/Xhtml_網頁製作

16 May 2016

這篇文章主要介紹了html代碼文字框限制輸入、文字框變灰色、限製文字框輸入,需要的朋友可以參考下

JS控製文字方塊textarea輸入字數限制的方法_javascript技巧 JS控製文字方塊textarea輸入字數限制的方法_javascript技巧

16 May 2016

JS控製文字方塊textarea輸入字數限制的方法,需要的朋友可以參考一下

jquery限制輸入字數,並提示剩餘字數實現代碼_jquery jquery限制輸入字數,並提示剩餘字數實現代碼_jquery

16 May 2016

jquery限制輸入字數,並提示剩餘字數,本文將介紹如何實現這個功能,需要了解的朋友可以參考下

js實作文字方塊輸入文字個數字限製程式碼_javascript技巧 js實作文字方塊輸入文字個數字限製程式碼_javascript技巧

16 May 2016

這篇文章主要介紹了js實作文字方塊輸入文字個數限製程式碼,文字方塊輸入的文字個數並不是無限制的,一般都會限定一個輸入最高上限,如何限制,請看本文

jquery限定文字方塊只能輸入數字(整數和小數)_jquery jquery限定文字方塊只能輸入數字(整數和小數)_jquery

16 May 2016

這篇文章主要介紹了jquery限定文字方塊只能輸入數字,包括整數和小數,有興趣的朋友可以參考一下

jquery怎麼限製文字方塊中輸入的字元數量 jquery怎麼限製文字方塊中輸入的字元數量

10 Apr 2023

jQuery是一個廣泛使用的JavaScript函式庫,它為Web開發提供了豐富的功能和易於使用的語法。在網路開發中,一項重要的任務是對表單進行驗證和控制使用者輸入。其中一個常見的需求是限製文字方塊中輸入的字元數量。 jQuery透過設定maxlength屬性來實現這項功能。在jQuery中,我們可以使用attr()函數來設定文字方塊的屬性,其中maxlength是用來指定文字方塊的最大字

See all articles See all articles

Hot Tools

jQuery2019情人節表白放煙火動畫特效

jQuery2019情人節表白放煙火動畫特效

一款抖音上很火紅的jQuery情人節表白放煙火動畫特效,適合程式設計師、科技宅用來向心愛的女孩告白,無論你選擇願意或不願意,到最後都得同意。

layui響應式動畫登入介面模板

layui響應式動畫登入介面模板

layui響應式動畫登入介面模板

520情人節表白網頁動畫特效

520情人節表白網頁動畫特效

jQuery情人節表白動畫、520表白背景動畫

酷炫的系統登入頁

酷炫的系統登入頁

酷炫的系統登入頁

HTML5卡音樂播放器-CASSETTE PLAYER

HTML5卡音樂播放器-CASSETTE PLAYER

HTML5卡音樂播放器-CASSETTE PLAYER