文档章节

CKEditor与jQuery整合

swingcoder
 swingcoder
发布于 2017/08/26 14:29
字数 309
阅读 179
收藏 0
<script src="jquery.js"></script>
<script src="ckeditor.js"></script>
<script src="adapters/jquery.js"></script>

//初始化
$( 'textarea.editor' ).ckeditor();

//使用jquery chain
$( '.section-x' )
    .find( 'textarea.editor' )
        .ckeditor()
    .end()
    .find( 'a' )
        .addClass( 'mylink' )
    .end();

//ready的回调
 $( 'textarea' ).ckeditor( function( textarea ) {
   // Callback function code.
 } );

#配置属性
$( 'textarea' ).ckeditor( {
     uiColor: '#9AB8F3'
 } );

// 获取编辑器的内容
var data = $( 'textarea.editor' ).val();
// 设置编辑器的内容
$( 'textarea.editor' ).val( 'My new content' );

https://docs.ckeditor.com/#!/guide/dev_jquery

CKEditor 普通初始化方法

//初始化
var editor;
if ( typeof CKEDITOR !== 'undefined' ) {
            editor = CKEDITOR.replace('brief');
            CKFinder.setupCKEditor(editor, '/Public/Admin/vendors/ckfinder/');
        }else{
            layer.msg('需要CKEditor');
        }

//得到editor的值
data['brief'] = encodeURI($('#brief').val());
或
data['brief'] = encodeURI(editor.getData());

//用js设值(会附加在旧数据后面)
editor.insertHtml(decodeURI(data.brief));
//全部更新
editor.setData(decodeURIComponent(data.brief));

 

CKFinder(官方的CKFinder因要购买,推荐使用KCFinder代替,功能类似,没有限制

https://docs-old.ckeditor.com/ckfinder3-php/configuration.html

与PHP的整合

找到ckfindier目录下的config.php文件

要修改这个方法返回true或false,则上不了文件。简单的讲就是要校验一下用户是否有登录(不过也容易被人xss)

$config['authentication'] = function () {
    return false;
};

 

CKEditor问题收集:

CKEditor与Bootstrap整合时,因Modal层内嵌CKEditor导致图片属性不能修改的问题,是因为与Modal的tabindex="-1"属性产生了冲突,去掉就OK.

<div class="modal inmodal fade" id="myModal5" tabindex="-1" role="dialog" aria-hidden="false">

© 著作权归作者所有

swingcoder
粉丝 33
博文 326
码字总数 73756
作品 0
广州
技术主管
私信 提问
CKEditor 4.2 发布,不支持 IE7 和 FF 3.6

CKEditor 4.2 发布了,包含等待已久的 jQuery 适配器,同时引入了新的文本缩进机制,包括 Tab 和 Shift+Tab 快捷键的处理。同时需要注意的是该版本不再支持 IE7 和 Firefox 3.6。详细介绍请看...

oschina
2013/07/19
4.9K
16
Struts2 jQuery Plugin 3.0 的新特性

Struts2 jQuery Plugin 是一个 Struts2 的插件,用来提供 Ajax 功能和基于 jQuery 的 UI部件。最新发布的 3.0 版本包含很多新特性和改进哦。 主要有: 全新的树状列表标签 基于 jQuery jsTre...

红薯
2011/05/09
5K
7
ECShop 将FckEditor编辑器升级或更换成CKEditor

本人在二次开发ecshop 2.7.1引入了JQuery后FckEditor一直有问题,点击FckEditor上的功能按钮后只出现个"Cancel"按钮,其他都被"div"层履盖,只能刷新重来。最近有机会来做SEO优化,经常要发软...

Ric的博客
2013/07/11
0
0
使用ckeditor上传文件后,返回的javascript ckeditor无法识别,读不到源文件

ckeditor配置很顺利的完成,使用的是demo里面的,然后上传文件也能够正常保存,但是在返回javascript后ckeditor并没有执行我返回的js而是把他打印出来了?请各位高手指导,ckeditor版本是4.4...

OSC_代码审查官
2014/05/27
640
2
Javascript获取或设置ckeditor的数据

例如在页面中载入了ckEditor作为程序内容的输入。 <textarea name="content" id="content"></textarea><br> <input type="submit" value="submit" onclick="submit()"> <script src="/ckedit......

Junn
2013/06/23
0
0

没有更多内容

加载失败,请刷新页面

加载更多

好程序员web前端分享逻辑运算

  一门计算机语言,编程的核心在于逻辑思想,当我们在编写程序的时候,逻辑是否通顺,是能否正确写出程序的关键,可以说如果你掌握了逻辑,那么你就踏入了计算机编程的大门。 &&与 || 或 ...

好程序员IT
21分钟前
1
0
我的Linux系统开始学习的过程

我的Linux系统开始学习的过程 Linux系统,不知大家是否了解。接触计算机不多或对计算机不感冒的人可能对其比较陌生,曾经的我也是。上大学前的我的确对Linux一无所知,那时候接触面窄,都没有...

linuxCool
21分钟前
1
0
让自己的网站可以被搜索

第一步:先注册一个属于自己的域名,这个域名是独一无二的。推荐到主机屋注册一个,其实在哪里注册都是一样的,但是主机屋提供免费的地址解析服务(只对在主机屋注册的域名免费)。 主机屋官...

WinkJie
24分钟前
2
0
全站加速(DCDN)- IP应用加速产品解读

5月22日下午15点,阿里云全站加速(DCDN)-IP应用加速如期发布。IP应用加速是阿里云自主研发的一款更高效、更安全、更便捷的动态加速产品,结合阿里云CDN本身的资源优势,利用就近接入、智能...

阿里云官方博客
27分钟前
1
0
k8s常用命令

1.创建deployment资源kubectl apply -f nginx.yml2.删除deployment资源kubectl delete -f nginx.yml3.查看deployment资源基本信息deployment资源(运行的服务资源)kubectl get...

平头哥-Enjoystudy
27分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部