CKEditor如何統計文字數量

    今天在修改v5後臺的比賽系統時，發現文本框須要限制輸入字數。咱們這個系統用的是3.6.3版本的，前臺代碼是這樣的

    

<script>
           //編輯器
        CKEDITOR.replace('matchContent',{
        resize_enabled : false,  //是否窗口能夠擴展
            sharedSpaces :
            {
                    top : 'topSpace',
                    bottom : 'bottomSpace'
            },
        toolbar :[
            ['Cut','Copy','Paste','PasteText','-'], 
            ['Undo', 'Redo', '-', ,'Find','SelectAll', 'RemoveFormat'], 
            //加粗 斜體， 下劃線 穿過線 下標字 上標字
            ['Bold','Italic','Underline','Strike'],
            //數字列表 實體列表 減少縮進 增大縮進
            ['NumberedList','BulletedList','-','Outdent','Indent'],
            //左對齊 居中對齊 右對齊 兩端對齊
            ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
            //圖片 flash 表格 水平線 表情 特殊字符 分頁符
            ['Image','Table','HorizontalRule','SpecialChar'],
            //樣式 格式 字體 字體大小
            ['Styles','Format','Font','FontSize'],
            //文本顏色 背景顏色
            ['TextColor','BGColor'],
            ],
         height:150     
        },
    {
    type : 'textarea',
    id : 'message',
    label : 'Your comment',
    'default' : '',
    validate : function() {
        if ( this.getValue().length < 5 )
        {
            api.openMsgDialog( 'The comment is too short.' );
            return false;
        }
    }
}
    );
    
     </script>

 

通過不斷的嘗試，最終採用CKEDITOR.instances.matchContent.getData().length，這就是這個輸入框的文字長度，而後給它添加一段javascript便可。請主要matchContent就是上面的代碼中定義的，因此要注意更改。

 

 

而這兒繼而又延伸出兩個問題，第一個就是，雖然CKEDITOR.instances.matchContent.getData()能夠取出咱們輸入的內容，可是裏面會包括html標籤（例如<p>123</p>）,故而咱們要寫一段javascript來過濾html標籤——filterHtml函數;其二就是如何計算字符，而咱們定下來的規則則是（中文2個字符，英文1個字符）——strleng函數。

 

具體代碼以下。

 

else if (strlen(filterHtml(CKEDITOR.instances.matchContent.getData()))>600){
                alert("比賽介紹不能超過300字");
                return false;
            }

 

filterHtml函數和strleng函數 請見下一篇文章。