CKEditor编辑器在项目中简单的调用方法

时间：2017-12-01|栏目：工具资源|点击：次 |我要投稿

1、首先需要到官方下载CKEditor编辑器，网址：https://ckeditor.com/ckeditor-4/download/，建议选择第三种“Full Package”因为这个最全，点击“Download”开始下载，如下图所示：

2、解压刚下载的zip包，获得编辑器完整文件，如下图所示：

CKEditor编辑器在项目中简单的调用方法

3、项目中调用，需要将CKEditor整个文件夹放到网站资源目录下，然后在需要添加CKEditor编辑器的页面中引入CKEditor的核心文件ckeditor.js：

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

4、然后在需要引用编辑器的位置加上下面这行代码：

<textarea id="editor2" name="editor2">我是CKEditor编辑器</textarea>
<script type="text/javascript">CKEDITOR.replace('editor2')</script>

5、完整代码如下：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>CKEditor编辑器</title>
	<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
</head>
<body>
<div align="center">
<h1>CKEditor编辑器</h1>
<textarea id="editor2" name="editor2">我是CKEditor编辑器</textarea>
<script type="text/javascript">CKEDITOR.replace('editor2')</script>
</div>
</body>
</html>

6、打开网站，查看效果，如下图所示：

CKEditor编辑器在项目中简单的调用方法

7、此时，一款完整的编辑器就显示出来了，是不是挺简单，但是这个编辑器居然不能上传图片、flash等文件，需要结合它的另一款工具CKFinder使用，至于CKEditor和CKFinder如何结合起来，下次再做分析吧！

(资源库 www.zyku.net)

CKEditor 编辑器

上一篇：CKEditor 4.x 代码高亮插件SyntaxHighlighter和Code Snippet安装以及调用方法

栏目：工具资源

下一篇：CKEditor利用ThinkPHP上传图片的方法

本文标题：CKEditor编辑器在项目中简单的调用方法

本文地址：https://www.zyku.net/gongju/1573.html

更多互联网推荐教程

工具资源

CKEditor编辑器在项目中简单的调用方法

您可能感兴趣的文章

最近更新

阅读排行

猜你喜欢