快捷導(dǎo)航

FCKEidtor 自動(dòng)統(tǒng)計(jì)輸入字符個(gè)數(shù)(IE)

更新時(shí)間：2009年05月29日 20:43:16 作者：

由于項(xiàng)目需要，需要做字?jǐn)?shù)統(tǒng)計(jì)，于是寫了一個(gè)JS計(jì)算字符個(gè)數(shù)，如果輸入的字符數(shù)大于100個(gè)字符，就彈出提示，點(diǎn)擊【確定】后，自動(dòng)截取為100個(gè)字符。

此方法支持IE 不支持火狐?？赡苁且?yàn)镕CKEidtor的keyup方法在火狐下不被支持。
FCKEditor編輯器換為TextBox，應(yīng)該就沒(méi)有問(wèn)題了。
前臺(tái)：

復(fù)制代碼代碼如下:

<tr> 
<th> 
短敘述 
<br /> 
（限100中文字）<br /> 
當(dāng)前文字個(gè)數(shù):<asp:Label ID="lblShowTextLength" runat="server" Text="0" ForeColor="Red"></asp:Label><br /> 
</th> 
<td style="text-align: left;"> 
<FCKeditorV2:FCKeditor ID="fckPrdDescription" runat="server" Height="240px" Width="100%"> 
</FCKeditorV2:FCKeditor> 
</td> 
</tr> 

JS代碼：

復(fù)制代碼代碼如下:

<script type="text/javascript"> 
function FCKeditor_OnComplete(editorInstance) 
{ 
var oEditor = FCKeditorAPI.GetInstance('fckPrdDescription'); 
oEditor.EditorDocument.body.onkeyup=function () 
{ 
if( document.all) 
{ 
$("lblShowTextLength").innerText =oEditor.EditorDocument.body.innerText.length; 
} 
else 
{ 
var r = oEditor.EditorDocument.createRange() ; 
r.selectNodeContents( oEditor.EditorDocument.body ) ; 
$("lblShowTextLength").innerText= r.toString().length ; 

} 
if(parseInt($("lblShowTextLength").innerText)>100) 
{ 
alert("當(dāng)前已經(jīng)達(dá)到100中文字,請(qǐng)不要繼續(xù)輸入！"); 
oEditor.EditorDocument.body.innerText=oEditor.EditorDocument.body.innerText.substring(0,100); 
$("lblShowTextLength").innerText =oEditor.EditorDocument.body.innerText.length; 
} 
// $("ddd").value =oEditor.EditorDocument.body.innerHTML; 
} 
if (document.getElementById("hidStatus").value=="Cancel") 
{ 
editorInstance.EditorDocument.designMode="off"; 
} 
} 
</script>

演示：
輸入多馀100個(gè)字符數(shù) 提示

點(diǎn)擊【確定】后自動(dòng)截取100個(gè)字符

您可能感興趣的文章:

相關(guān)文章

基于開(kāi)發(fā)中使用UEditor編輯器的注意事項(xiàng)詳解
下面小編就為大家分享一篇基于開(kāi)發(fā)中使用UEditor編輯器的注意事項(xiàng)詳解。具有很好的參考價(jià)值。一起跟隨小編過(guò)來(lái)看看吧，希望對(duì)大家有所幫助
2017-11-11
為ckeditor編輯器加上傳圖片的功能
CKEditor官方演示是有上傳圖片和瀏覽服務(wù)器文件功能的，但是我們自己下載回來(lái)的卻沒(méi)有這兩個(gè)功能其實(shí)還需要下載另外一個(gè)組件：CKFinder，用它配合CKEditor來(lái)實(shí)現(xiàn)上傳功能
2012-07-07
UEditor 默認(rèn)字體和字號(hào)的修改方法
這篇文章主要介紹了UEditor 默認(rèn)字體和字號(hào)的修改方法,需要的朋友可以參考下
2017-03-03
FCKeditor 編輯器插入代碼功能實(shí)現(xiàn)步驟
4步輕松打造可以應(yīng)用于任何FCK編輯器的CMS及其他程序,一個(gè)Fckeditor編輯器的插件，it560獨(dú)家首發(fā)教程,無(wú)需增加字段，不修改代碼，完全綠色環(huán)保。
2009-11-11
fckeditor 代碼語(yǔ)法高亮
這兩個(gè)星期有點(diǎn)空，就再研究了一下語(yǔ)法高亮的問(wèn)題，找了一下FCKeditor官方網(wǎng)站，發(fā)現(xiàn)2.5.1穩(wěn)定版已經(jīng)出來(lái)了，首先替換掉舊的2.0。呵呵，我喜歡使用新版。
2009-06-06
使用 CodeMirror 打造屬于自己的帶高亮顯示的在線代碼編輯器
寫這個(gè)的目的是因?yàn)橹绊?xiàng)目里用到過(guò) CodeMirror，覺(jué)得作為一款在線代碼編輯器還是不錯(cuò)，也看到過(guò)有些網(wǎng)站用到過(guò)在線代碼編輯，當(dāng)然我不知道他們是用什么做的
2018-02-02
XHEditor編輯器使用文檔
XHEditor編輯器的使用方法，需要的朋友可以參考下。
2010-12-12
FCKeditor ASP.NET 上傳附件研究
FCKeditor很好用，而且是開(kāi)源軟件。最近研究了一下自帶的上傳功能，對(duì)源代碼作了一點(diǎn)修改，也算是依照開(kāi)源軟件的要求，介紹一下。
2009-06-06
Ewebeditor 不能粘貼或復(fù)制的解決方法
在調(diào)試網(wǎng)站后臺(tái)時(shí),遇見(jiàn)用EWEBEDITOR編輯內(nèi)容時(shí),不能從其他文件來(lái)源粘貼到里面.
2010-05-05
ASp.net下fckeditor配置圖片上傳最簡(jiǎn)單的方法
fckeditor 的基本配置我就不講了，講講圖片上傳這塊吧；
2010-01-01