Ckeditorckfinder简单整合使用

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

注意版本:ckeditor4.0ckfinder2.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是获取不到的)

ckeditor与ckfinder简单整合使用的更多相关文章

  1. Ckeditor与Ckfinder(java)整合实现富媒体内容编辑(支持文件上传)

    先来看一下最终的效果图 一.编辑器界面 二.上传图片界面 <!-------------------------------------------------------> 一.安装包下 ...

  2. CKEditor与CKFinder整合 MVC3

    今天偶然看到一篇关于 CKEditor与CKFinder整合文章,心想有一段时间没有使用这种东西了.于是乎自己动手亲自体验了一下,本以为简单但在东西编写的过程发现了很多没有遇见毛病. 所以记录一下自己 ...

  3. CKEditor和CKFinder整合实现上传下载功能

    CKEditor与CKFinder整合并实现文件上传功能 事先说明:此整合的是java版本号的, 用到的有:jsp + ckeditor + ckfinder (没有servlet 及其他框架技术) ...

  4. 基于MVC4+EasyUI的Web开发框架经验总结(5)--使用HTML编辑控件CKEditor和CKFinder

    Web开发上有很多HTML的编辑控件,如CKEditor.kindeditor等等,很多都做的很好,本文主要介绍在MVC界面里面,CKEditor的配置和使用.CKEditor的前身是FCKEdito ...

  5. 编辑控件CKEditor和CKFinder

    -使用HTML编辑控件CKEditor和CKFinder Web开发上有很多HTML的编辑控件,如CKEditor.kindeditor等等,很多都做的很好,本文主要介绍在MVC界面里面,CKEdit ...

  6. CKEditor与CKFinder的配置(ASP.NET环境)

    CKEditor是一个专门使用在网页上的所得文字编辑器,适用于PHP.ASP.NET.Java等后端开发语言.CKEditor原名为FCKeditor,“FCK” 是这个编辑器的作者的名字Freder ...

  7. php环境下ckeditor和ckfinder的配置详解

    摘要:老牌编辑器FCK的升级版CKEditor(http://ckeditor.com/) 经过重写,提供了丰富而强大的集成和互动的API.新版编辑器是完全基于插件,它可以扩展所有部件以符合需求.FC ...

  8. 在JSP里使用CKEditor和CKFinder

    在JSP里使用CKEditor和CKFinder 最 近在做一个新闻发布平台,放弃了很早的FCKEditor,使用CKEditor和CKFinder,尽管免费的CKFinder是Demo版本,但是功 ...

  9. Ckeditor与Ckfinder的配合使用,上传图片、水印、修改图片名字为当前日期 asp.net

    为了配置出来上传功能,并且还添加水印,修改图片的名字为日期,真的头疼了很久,现在来分享一下自己所做的,也算一点小小的成就吧,顺带帮帮很多还在弄这个的猿们.我是分别用了两种方法.先说低版本的Versio ...

随机推荐

  1. hadoop错误INFO util.NativeCodeLoader - Unable to load native-hadoop library for your platform... using builtin-java classes where applicable

    报如下错误: 解决方法: 1.增加调试信息 在HADOOP_HOME/etc/hadoop/hadoop-env.sh文件中添加如下信息 2.再执行一次操作,看看报什么错误 上面信息显示,需要2.14 ...

  2. Android BLE开发——Android手机与BLE终端通信初识

    蓝牙BLE官方Demo下载地址:   http://download.csdn.net/detail/lqw770737185/8116019参考博客地址:    http://www.eoeandr ...

  3. XC通讯录

    XC通讯录基于Android4.4开发的一个手机通讯录,具有手机拨号,添加联系人,查看联系人,管理编辑联系人,智能查找联系人,删除及批量删除,备份/还原数据,以及手机联系人导入等功能,界面简洁美观,欢 ...

  4. promise和Angular中的 $q, defer

    在ES6语法中,新出了promise构造函数, 可用来生成promise实例. Promise对象: 代表了未来某个将要发生的事件(通常是一个异步操作).有了promise对象, 可以将异步操作以同步 ...

  5. iOS UIKit:CollectionView之布局(2)

    Collection view使用UICollectionViewFlowLayout对象来管理section中的cell,该对象是一种流布局方式,即在collection view中的section ...

  6. Shell: extract more from listener.log(分析监听日志)

    最近遇到了两起数据库连接数不足的问题, 通常都会预留一些会话增加的情况, 但在一些特殊情况下如连接风暴(logon storm), 如果在监听中没有做rate限流,对数据库来说巨大的冲击可能会导致数据 ...

  7. Twisted介绍

    Twisted诞生于2000年初,作者为Glyph,目的是为了开发网络游戏. Twisted的历史 Glyph开始采用Java多线程,来开发Twisted Reality,结果多线程使得开发变得复杂, ...

  8. Python:对象

    #!/usr/bin/python3 #对象实例 class Person: num=200 def __init__(self,name,sex): self.name=name self.sex= ...

  9. 关于项目既要使用ant脚本又要使用maven pom.xml文件的问题

    背景:项目使用的是ant脚本打包,但又需要maven去执行sonar代码扫描.所以项目中既有build.xml又有pom.xml build.xml设置的打包后产物文件夹为target,maven运行 ...

  10. X-Plane飞行模拟资源整理一

    计划开一个博客整理一下飞行仿真软件二次开发的相关内容 预计将陆续介绍X-Plane.Microsoft Flight Simulator.FlightGear三个主流飞行模拟器. 此处为目录(占坑,随 ...