两个文本编辑器fckediter、 tiny_mce

昨天群里一个朋友需要文本编辑功能，就给了他fckediter，还有一个编辑器也是很好的：tiny_mce，我觉得要比fckediter强大，下面来总结一下这两个编辑器的用法：

fckediter：

效果图：

 

用法：

首先去网上下载fckediter，然后按着这四步来：

1.复制fckeditor到网站跟目录下

2.复制FredCK.FCKeditorV2.dll到Bin目录下，再添加引用

3.配Web.config和fckconfig.js

  (1)AppSettings中添加

  
  

   
   <
   
   appSettings 
   
   >
   
   

    
   
   <
   
   add key
   
   =
   
   "
   
   FCKeditor:BasePath
   
   "
   
    value
   
   =
   
   "
   
   ~/fckeditor/
   
   "
   
   />
   
   

    
   
   <
   
   add key
   
   =
   
   "
   
   FCKeditor:UserFilesPath
   
   "
   
    value
   
   =
   
   "
   
   /Website1/UploadFiles/
   
   "
   
   />
   
   

  
   
   </
   
   appSettings
   
   >
  
  

  (2)在fckconfig.js中找到FCKConfig.DefaultLanguage＝en，修改为zh-cn。接着设置你所使用的语言

  
  

   
   var _FileBrowserLanguage    
   
   =
   
    
   
   '
   
   asp
   
   '
   
    ;   
   
   //
   
    asp | aspx | cfm | lasso | perl | php | py
   
   

   
   
var _QuickUploadLanguage    
   
   =
   
    
   
   '
   
   asp
   
   '
   
    ;   
   
   //
   
    asp | aspx | cfm | lasso | perl | php | py
  
  

4.使用

  
  

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


   
   <
   
   FCKeditorV2:FCKeditor id
   
   =
   
   "
   
   OnLinkEditor
   
   "
   
    runat 
   
   =
   
   "
   
   server
   
   "
   
    
   
   ></
   
   FCKeditorV2:FCKeditor
   
   >
  
  

 tiny_mce：

首先看一下tiny_mce的效果图：

 

用法：

tiny_mce有自己的网站，先去官网下载文件，使用步骤也是很简单的：

1：复制jscripts文件夹到根目录下，在页面引用tiny_mce.js文件

  
  

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

2：在页面注册tinyMCE.init

  
  

   
   <
   
   script type
   
   =
   
   "
   
   text/javascript
   
   "
   
   >
   
   

        tinyMCE.init

    (

    {

        mode: 
   
   "
   
   textareas
   
   "
   
   ,

        theme: 
   
   "
   
   advanced
   
   "
   
   

    }

    );

  

    
   
   </
   
   script
   
   >
  
  

3:最后使用就可以了：

  
  

   
   <
   
   textarea name
   
   =
   
   "
   
   content
   
   "
   
    style
   
   =
   
   "
   
   width:100%
   
   "
   
   >