【js】kindeditor富文本编辑器的简单使用

最新推荐文章于 2024-09-20 10:13:41 发布

evan_qb

最新推荐文章于 2024-09-20 10:13:41 发布

阅读量747

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/Evan_QB/article/details/83105034

版权

首先去下载kindeditor的相关文件

引入css以及js

<link rel="stylesheet" href="js/kindeditor-4.1.10/themes/default/default.css">
<script src="js/kindeditor-4.1.10/kindeditor-all-min.js"></script>
<script src="js/kindeditor-4.1.10/lang/zh_CN.js"></script>

准备一个隐藏的textarea

<body>
    <textarea style="width:800px;height:300px;visibility:hidden;" name="desc"></textarea>
</body>

然后进行简单的初始化

<script>
    //简单模式初始化
    var editor;
    KindEditor.ready(function(K) {
        editor = K.create('textarea[name="desc"]', {

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

evan_qb

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

js引入kindeditor富文本编辑器的使用

天天向上

06-14

2111

1. 在官网上下载KindEditor文件，可以删掉不需要要到的jsp，asp，asp.net和php文件夹。接着把文件夹放到项目文件目录下。 2. 修改html文件，在页面引入js文件： <script type="text/javascript" src="./kindeditor/kindeditor-all.js"></script> <script type="text/javascript" src="./kindeditor/lang/zh-CN.js"

kindeditor富文本编辑器以及使用文档说明.zip

10-29

这个压缩包“kindeditor富文本编辑器以及使用文档说明.zip”包含了关于KindEditor的详细资料，包括安装、配置、使用方法以及可能遇到的问题解决方案。首先，安装KindEditor非常简单。通常，开发者会将编辑器的...

参与评论您还未登录，请先登录后发表或查看评论

KindEditor简单模式

09-22

kindEditor的一种简单的富文本框编辑器

kindeditor在线编辑器最简模式.7z

02-16

kindeditor编辑器最简模式,308K IE下JS有些许错误，火狐、Opera、Chrome_Portable未见错误无上传，适用于前台客户

KINDEDITOR改造WORD文档快速发帖，一键转存

最新发布

weixin_52050572的博客

09-20

1172

编辑器：KindEditor需求：从word复制粘贴内容和图片系统：windows,macOS,linux,信创国产化前端：vue2,vue3,vue-cli,后端：java,asp.net,php,asp要求：开源，免费，技术支持最近这块好像很火，或者说需求有点旺盛，今天早上又有网友加我微信，实际上之前就已经在网上公布了微信号了，但是很多网友还是说找不到，这就有点困难了。

KindEditor简单的Demo使用

weixin_30244681的博客

07-16

164

一般的做网站后台都会用到富文本编辑器，网上也有很多优秀的富文本编辑器，这里是开源中国的富文本编辑器推荐：http://www.oschina.net/project/tag/172/wysiwyg 我用过CKeditor比较庞大，这里我用了一个国产开源的富文本编辑器（JS开发）KindEitor官网地址：http://www.kindsoft.net/ 开始前我要说下，开发时最好用最新的Kin...

在线文本编辑器kindeditor简单化

HU452261426的博客

03-02

131

$(document).ready(function () { KindEditor.ready(function (K) { editor = K.create('#txtMainContent', { cssPath: '../../common/kindeditor/plugins/code...

Django添加KindEditor富文本编辑器的使用

12-24

通过以上步骤，我们就成功地在Django Admin中集成了KindEditor富文本编辑器。在编辑内容时，用户可以看到一个可视化、功能丰富的编辑界面，提升了编辑效率。同时，KindEditor还支持更多的自定义配置和扩展功能，可以...

Kindeditor 富文本编辑器实例Demo

04-21

1. **富文本编辑器的基本概念**：富文本编辑器不同于简单的纯文本编辑器，它可以处理格式化的文本，包括字体、字号、颜色、对齐方式、列表、链接、图片等元素。Kindeditor作为一款富文本编辑器，提供了这些功能，...

富文本编辑器KindEditor在前端JS的应用

脑壳疼

03-07

445

1.引入KindEditor资源包 2.页面引入Js,Css文件 3.html代码： <tr> <td class="left">讲师信息</td> <td> <textarea id="cot_detail" class=&

kindeditor-all.js

10-10

kindeditor改造支持上传图片，修复iframe跨域出现的问题,，提供给用户进行下载，防止用户以为使用了kindEditor造成的图片上传不了，发生报错

kindeditor 相关JS文件

11-19

kindeditor文本编辑器用到的js文件

富文本编辑器kindeditor

12-27

富文本编辑器访问页面：http://localhost:8080/testkindeditor/jsp/demo.jsp

详细介绍如何使用kindEditor编辑器

weixin_30387799的博客

08-15

203

今天群里的朋友问我能不能写个kindEditor编辑器的使用教程，说是弄了半天没有搞定。由于PHP啦后台正好用了这个编辑器，我有写经验，正好教他的同时写出来分享给大家。 kindEditor编辑器是一个由JS写成的在线编辑器，很多网站或CMS等都有用它，口碑不错，目前最新版本是4.1.10。其实它的用法非常简单，我是在下载了它的安装包后看了一些demo然后就把它放到PHP啦的后台上去...

KindEditor 编辑器之简易使用

02-25

1198

在最近做的项目中，有个提交作业的功能，通过KindEditor 编辑器来实现还是很好用的。下面就先介绍下KindEditor ，KindEditor 是一套开源的在线HTML编辑器，主要用于让用户在网站上获得所见即所得编辑效果，开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本输入框。这是官网的下载地址：http://kinde

JS之kindeditor的用法简介

11-29

3513

## 解压Kindeditor的压缩包 ## 前段页面（内嵌name为content的标签即可） ## js代码 var editor; KindEditor.ready(function(K) { editor = K.create('textarea[name="content"]', { ne

kindeditor富文本编辑器的简单使用方法

sunmeng_sunmeng的博客

04-23

467

1 首先得和官网的使用步骤一致引入css，和js //默认样式，涵盖比较全 <link rel="stylesheet" href="/kindeditor/themes/default/default.css" /> //简单模式，编辑操作只有部分，但是我在用的时候好像没效果， //如果有哪位大佬无意中点进这篇文章，可否留下您的评论，在下先谢过了。 <link rel="st...

富文本kindeditor-all.js

肖肖肖丽珠的博客

05-21

1961

初始化：//富文本 var kindEditorObj = null; //富文本 kindEditorObj = KindEditor.create('textarea[name="viedoDesc"]', { width: '72%', height: '300px', items: KindEdit...