ckeditor与ckfinder简单整合使用

Ckeditor与ckfinder简单整合使用

功能:主要用来发送图文的email，图片上传到本地服务器，但是email的图片地址要写上该服务器的远程地址（图片地址；例如:http://www.baidu.com/logo/1.png[s1] ）

注意版本：ckeditor4.0和ckfinder2.4

阅读技巧：红色为要解释的目标，蓝色为要解释的内容

其他什么修改文件存放路径啊，语言什么的网上都有，这只是展示了简单的整合。

 

1、 创建页面并编写HTML

<textarea cols="30" rows="30" name="ck[s2] "></textarea>

 

2、 引用AjaxUpload.js文件

<script type="text/javascript" src="public/ckeditor/ckeditor.js[s3] "></script>

   <scripttype="text/javascript" src="public/ckeditor/ckfinder/ckfinder.js[s4] "></script>

 

3、 编写JS脚本

   <script type="text/javascript">

     ck = CKEDITOR.replace( 'ck[s5] ',

     {

             　 filebrowserBrowseUrl : '<?php  echo base_url();?>[s6] public/ckeditor/ckfinder/ckfinder.html',

                 filebrowserImageBrowseUrl : 'public/ckeditor/ckfinder/ckfinder.html?Type=Images',

           　　filebrowserFlashBrowseUrl : 'public/ckeditor/ckfinder/ckfinder.html?Type=Flash',

     　　　　 filebrowserUploadUrl:'public/ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',                    　　　　　   filebrowserImageUploadUrl :'public/ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUploadtype=Images',          

　　　　　　filebrowserFlashUploadUrl :'public/ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'[s7]         });

  </script>

 

4.获取ckeditor的值

 <script>

      ck_val[s8]  = ck[s9] .document.getBody().getHtml();[s10] 

</script>

---

 [s1]要远程地址

 [s2]必须知道的id

 [s3]Ckeditor插件的位置

 [s4]将ckfinder插件放入ckeditor文件夹里面

 [s5]与页面的id要对应

 [s6]需要远程地址，例如:http://www.baidu.com/public/ckeditor/…..(以下几个都要远程地址)

 [s7]有待研究

 [s8]这个值，可以用来的做发送email，带有图文。不过图片路径需要处理

 [s9]与页面的id要对应

 [s10]获取ckeditor的编辑器所输入的值(用value是获取不到的)