ckeditor编辑器插件提交时获取编辑器的内容如何自定义ckeditor编辑器的默认内容

2024年03月31日 ckeditor文档 ckeditor编辑器获取ckeditor内容获取ckeditor编辑器内容修改编辑器ckeditor内容共享博客

首先，请大家自行下载 ckeditor.js 并引入，我使用的是ckeditor4，下面给大家分享一下获取ckeditor编辑器的内容，和自定义编辑器的内容。

我简单写个提交获取按钮和编辑器

<body>
    <textarea name="editor1" id="editor1" rows="10" cols="80"></textarea>
    <button id="GetBtn">获取内容</button>
</body>

JS中editor1是编辑器的id或name，大家自行修改自己定义的name或id。

<script>
	CKEDITOR.replace('editor1', {
		uiColor: '#CCEAEE'
	});

	// 编辑器默认的内容
	CKEDITOR.instances.editor1.setData("懒猪 lmcjl.com");

	var GetBtn = document.getElementById("GetBtn");
	// 点击时获取编辑器的内容
	GetBtn.onclick = function(){
		// 获取带html的内容
		console.log(CKEDITOR.instances.editor1.getData())
		// 获取纯文本内容
		console.log(CKEDITOR.instances.editor1.document.getBody().getText())
	}
</script>

自定义编辑器内容（常用语再次修改编辑器内容时重新打开）

CKEDITOR.instances.editor1.setData("懒猪 lmcjl.com");

获取编辑器带有HTML的内容（一般提交后台时提交此内容）

CKEDITOR.instances.editor1.getData()

获取编辑器纯文本内容（一般文章需要获取摘要，可用此方法，自行js截取下内容即可）

CKEDITOR.instances.editor1.document.getBody().getText()

更多请看ckeditor-4官方文档 https://ckeditor.com/ckeditor-4/

本文链接：http://so.lmcjl.com/news/790/

展开阅读全文

上一篇：Flask框架的安装（Windows平台）下一篇：mockjs生成随机数据参数介绍

ckeditor编辑器插件提交时获取编辑器的内容 如何自定义ckeditor编辑器的默认内容

ckeditor编辑器插件提交时获取编辑器的内容如何自定义ckeditor编辑器的默认内容