FCKeditor如何升級CKEditor及使用方法

以前編輯器用的是FCKeditor，由於項目緣由須要升級爲最新版本4.2.2，發現是已經改名爲CKEditor。

百度了一下，據官方的解釋，CK是對FCK的代碼的徹底重寫。

項目環境是asp.net的，以前用的FCKeditor版本是2.6。

在aspx文件頭須要引用FCK的名爲FredCK.FCKeditorV2.dll文件。

<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>

 使用控件以下寫法：

<FCKeditorV2:FCKeditor ID="fckContent" runat="server" Width="100%" BasePath="~/editor/" />

在.cs文件裏要取得該控件值：fckContent.Value

升級爲CKEditor後，有2種方法使用

第一種：去CKEditor官網找到下載CKEditor  for ASP.NET ，目前版本是3.6.4。

           解壓壓縮包，找到CKEditor.NET.dll，放到項目的bin目錄下

           aspx文件頭引用寫上：

<%@ Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>

           使用控件：

<CKEditor:CKEditorControl runat ="server" ID="ckContent" BasePath="~/editor/"></CKEditor:CKEditorControl> 

           .cs文件裏取得該控件值：ckContent.Text

           其中的BasePath是CKEditor的包文件所在目錄。（本人親測：包文件版本放的4.2.2也是能夠使用的。）

第二種：aspx文件裏head裏直接引用js文件：

<script type="text/javascript" src="../ckeditor/ckeditor.js"></script>

           body裏寫上以下便可（下面的script必定要在控件之下，放在head裏無論用）

<asp:TextBox name="ckContent" id="ckContent" runat="server" TextMode="MultiLine" Width="300px" Height="60px" CssClass="input"/> 

<script type="text/javascript"> 

CKEDITOR.replace( 'ckContent');
</script>

升級所有完工。

另外附上項目中的如何在CKEditor裏插入外部圖片寫法：

function OpenDialogPageForckEdit()
{
    var uri = '';
    var param = '';
    var oEditor = CKEDITOR.instances.ckContent;
    uri = 'V5Mall_Picture_Dailog.aspx?isfck=1&d=' + Date();
    if (navigator.appVersion.indexOf("MSIE") == -1)
    {
        this.returnAction = function(strResult)
        {
            if(strResult != null)
            {
                oEditor.insertHtml(GetValue);
				
            }
        }
        param = 'alwaysRasied=yes,modal=yes,width=620,height=800,top=100,left=200,resizable=no,scrollbars=no';
        var GetValue=window.showModalDialog(uri, '_blank', param);
        oEditor.insertHtml("<img src='" + GetValue + "'>"); 
        return;
    }
    else
    {         
        //param = 'dialogWidth:550px;dialogHeight:550px;';   
        param = 'alwaysRasied=yes,modal=yes,width=620,height=800,top=100,left=200,resizable=no,scrollbars=no';    
        var GetValue = window.showModalDialog(uri, '_blank', param);        
        if (GetValue != null)
        {
            oEditor.InsertHtml("<img src='" + GetValue + "'>");            
        }
    }
}