CKEditor/FCKEditor 使用 CKeditor 3.0.1 快速使用教程(含插入图片)
发布时间:2022-10-16 14:04:14
标签:CKeditor,网页编辑器,使用教程
因为直接把内容作为字符串给编辑器的 Value 属性赋值使用的是 JavaScript 代码,要让 JS 代码不受内容中双引号、换行等的干扰,只有先读入到 textarea 最方便。
使用 CKeditor 3.0.1
<textarea cols="90" rows="10" id="content" name="content">cftea</textarea>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript">
<!--
CKEDITOR.replace("content");
//-->
</script>
可以看出,3.x 版本的使用非常方便,也不用担心会形成两个同名的 content。实际上 textarea 的 id 省略了也是可以的,因为 CKEditor 会先按 name 来查找,查找不到,再按 id 来查找。
并且编辑器会在 textarea 的位置替换原有的 textarea。
设置编辑器皮肤、宽高
<textarea cols="90" rows="10" id="content" name="content">cftea</textarea>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript">
<!--
CKEDITOR.replace("content",
{
skin: "kama", width:700, height:300
});
//-->
</script>
skin 值应该是 ckeditor/skins 文件夹下的某个文件夹名称,如果指向不存在的皮肤,则不会显示编辑器。
设置值、取值
设置值
CKEDITOR.instances.content.setData("脚本之家"); // content 就是前面 CKEDITOR.replace 的第一个参数值
或
var editor = CKEDITOR.replace("content");
editor.setData("脚本之家");
取值
alert(CKEDITOR.instances.content.getData()); // content 就是前面 CKEDITOR.replace 的第一个参数值
或
var editor = CKEDITOR.replace("content");
alert(editor.getData());
插入图片
若要演示此示例,最好是放在按钮的事件处理程序中,目的是有些延迟。
CKEDITOR.instances.content.insertHtml("<img src=...>");


猜你喜欢
- 以前见过一个很漂亮的网页提示信息,就是把鼠标放到网页的文字或者图片上面就会有提示的那种透明的,还带个箭头,很漂亮,不知道谁在哪见过没有,感谢
- 问题联邦学习原始论文中给出的FedAvg的算法框架为:参数介绍: K 表示客户端的个数, B表示每一次本地更新时的数据量, E 表示本地更新
- 现在介绍加速网页图形显示速度的六种方法,为你解决这个难题。其最基本的宗旨就是,让你用买鱼的价钱,品尝到熊掌的美味和营养。 1.首先要确定图像
- 将训练好的模型参数保存起来,以便以后进行验证或测试,这是我们经常要做的事情。tf里面提供模型保存的是tf.train.Saver()模块。模
- 如下所示:import numpy as npimport pandas as pdfrom pandas import Series,Da
- 前言控制文件(control file)是一个相当小的文件(最多能增长到64M左右),其中包含Oracle需要的其他文件的一个目录。参数文件
- Software as a service 软件即服务,21世纪开始兴起的一种完全创新的软件应用模式。客户通过互联网向厂商定购所需的应用软件
- JSON 格式字段是 Mysql 5.7 新加的属性,不够它本质上以字符串性质保存在库中的,刚接触时我只了解 $.xx 查询字段的方法,因为
- 用python进行线性回归分析非常方便,有现成的库可以使用比如:numpy.linalog.lstsq例子、scipy.stat
- 今天以一个表单的自动提交,来进一步学习selenium的用法练习目标0)运用selenium启动firefox并载入指定页面(这部分可查看本
- 大家可以在Github上clone全部源码。Github:https://github.com/williamzxl/Scrapy_Craw
- 关于阻塞主线程join的错误用法Thread.join() 作用为阻塞主线程,即在子线程未返回的时候,主线程等待其返回然后再继续执行.joi
- 一、FFmpeg 多个音频合并的2种方法多个mp3文件合并成一个mp3文件一种方法是连接到一起ffmpeg64.exe -i "c
- 近期,又有接触到pyecharts这个包的使用,后面发现这个曾经好用的包发生了一些变化,为了方便大家的使用,这里整理如下:绘图风格theme
- 目录一、索引基本知识1.1 索引的优点1.2 索引的用处1.3 索引的分类1.4 面试技术名词1.5 索
- 背景开工前我就觉得有什么不太对劲,感觉要背锅。这可不,上班第三天就捅锅了。我们有个了不起的后台程序,可以动态加载模块,并以线程方式运行,通过
- 一、概述全文索引在表中包括一个或多个基于字符的列。这些列可以具有以下任何数据类型:char、varchar、nchar、nvarchar、t
- 最近看Python看得都不用tab键了,哈哈。今天看了一个经典问题--八皇后问题,说实话,以前学C、C++的时候有这个问题,但是当时不爱学,
- 学了一个礼拜Python之后写的,代码很粗糙,只是为了完成利用163邮箱远程关电脑功能。直接把代码发上来吧。要执行的话得先安装一些模块,看i
- 使用 vue-cli构建的项目,在 默认情况下 ,执行 npm run build 会将所有的js代码打包为一个整体,打包位置是