环境说明:KindEditor  4.1.11

一、确定你在使用KindEditor时,引用的是kindEditor-all.js,找到任何一个已经存在的功能,例如,清除HTML代码,我在做的时候本来是想将这个功能加在清除HTML代码这一功能中,后又觉得不妥,就在清除HTML代码下面,新建一个方法,如下,这才进入正题:

 KindEditor.plugin('clearTab', function (K) {
var self = this, name = 'clearTab';
self.clickToolbar(name, function () {
self.focus();
var html = self.html();
html = html.replace(/\ +/g, '');
html = html.replace(/\ +/g, '');
html = html.replace(/\ +/g, '');
html = html.replace(/\&ensp;+/g, ''); html = html.replace(/\s+([^<>]+)(?=<)/g, function (match) {
return html = match.replace(/\s+/g, '');
});
self.html(html);
self.cmd.selection(true);
self.addBookmark();
});
});

二、一键去除空格的主体功能好了,接下来就要在工具栏中展示了,很简单,找到items数组,在数组后追加“clearTab”,

三、此时你会发现工具栏中还是没有显示,接着找到‘KindEditor.lang’对象,新加一个

clearTab: '清除空格',  

四、接着你还发现没有显示出来,那是因为没有给样式,找到引用的default.css文件,新加样式,从样式可以看出来,你还需要个小图标来显示它,到这里就很随意啦,弄个你喜欢的图标就好

.ke-icon-clearTab{
background-position: 0px -1250px;
width: 16px;
height: 16px;
}

五、完成,效果如下

为KindEditor 添加“一键去除空格功能”的更多相关文章

  1. JavaScript去除空格的三种方法(正则/传参函数/trim)

    方法一: 个人认为最好的方法.采用的是正则表达式,这是最核心的原理. 其次.这个方法使用了JavaScript 的prototype 属性 其实你不使用这个属性一样可以用函数实现.但这样做后用起来比较 ...

  2. 一种简单的实现:Android一键换肤功能

    现在的APP开发,通常会提供APP的换肤功能,网上流传的换肤代码和实现手段过于复杂,我把原作者的代码重新整理抽取出来,转换成Eclipse项目,重新整理成正确.可直接运行的项目. 代码运行结果如图. ...

  3. oracle中如何对字符串进行去除空格的方法

    oracle中如何对字符串进行去除空格的方法 今天学习了一下oracle中如何对字符串进行去除空格的方法,这里总结一下.了解到的方法主要有两种:Trim函数以及Replace函数.下面我详细的介绍一下 ...

  4. JAVA之旅(十六)——String类,String常用方法,获取,判断,转换,替换,切割,子串,大小写转换,去除空格,比较

    JAVA之旅(十六)--String类,String常用方法,获取,判断,转换,替换,切割,子串,大小写转换,去除空格,比较 过节耽误了几天,我们继续JAVA之旅 一.String概述 String时 ...

  5. Visual Studio 2017 - Windows应用程序打包成exe文件(2)- Advanced Installer 关于Newtonsoft.Json,LINQ to JSON的一个小demo mysql循环插入数据、生成随机数及CONCAT函数 .NET记录-获取外网IP以及判断该IP是属于网通还是电信 Guid的生成和数据修整(去除空格和小写字符)

    Visual Studio 2017 - Windows应用程序打包成exe文件(2)- Advanced Installer   Advanced Installer :Free for 30 da ...

  6. 3D打印机如何添加自动调平功能

    原理说明 Kossel/Rostock等Delta(并联/三角洲)类型的机器,可以参考:http://learn.makerlab.me/guides/11 3d打印打印时最重要的是第一层的效果,如果 ...

  7. Tengine是由淘宝网发起的Web服务器项目。它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性

    简介 Tengine是由淘宝网发起的Web服务器项目.它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性.Tengine的性能和稳定性已经在大型的网站如淘宝网,天猫商城等得到了很 ...

  8. phpcms编辑器添加一键排版控件

    CKEditor添加一键排版插件实例,大家都知道phpcms也是ckeditor编辑器,那么如果增加这个一键排版这个牛逼功能呢增加好了后,效果图是这样的 废话不多说,直接说步骤第一步:config.j ...

  9. Android一键换肤功能:一种简单的实现

     Android一键换肤功能:一种简单的实现 现在的APP开发,通常会提供APP的换肤功能,网上流传的换肤代码和实现手段过于复杂,这里有一个开源实现,我找了一大堆,发现这个项目相对较为简洁:htt ...

随机推荐

  1. 1python简介

    02 python和03 python的区别: python:优美,清晰,简单. python2x:    源码重复,混乱,冗余.    源码不规范.     python3x: 源码整合,优美,清晰 ...

  2. 理解es6 中 arrow function的this

    箭头函数相当于定义时候,普通函数.bind(this)箭头函数根本没有自己的this,导致内部的this就是定义时候的外层代码块中的this.外层代码块中的this,则取决于执行时候环境上下文cont ...

  3. [dev] 中文版内核代码编码规范

    我是我最喜欢的编码规范.并始终坚持. https://www.kernel.org/doc/html/v4.15/translations/zh_CN/coding-style.html

  4. 【转载】Python日期时间模块datetime详解与Python 日期时间的比较,计算实例代码

    本文转载自脚本之家,源网址为:https://www.jb51.net/article/147429.htm 一.Python中日期时间模块datetime介绍 (一).datetime模块中包含如下 ...

  5. 封装和static 以及关键字“this”的用法

    1 封装 1.1 构造方法 构造方法是一种特殊的方法,专门用于构造/实例化对象,形式 [修饰符] 类名(){}: 1.1.1 无参构造 无参构造方法就是构造方法没有任何参数.构造方法在创建对象(new ...

  6. Oracle归档开启和更改

    运用 Xshell  客户端工具链接所在的  oracle  服务器 1.先进入数据库里面去 [root@DBSTANDBY ~]# su - oracle [oracle@DBSTANDBY ~]$ ...

  7. PDM:Training Models of Shape from Sets of Examples

    这篇论文介绍了一种创建柔性形状模型(Flexible Shape Models)的方法--点分布模型(Point Distribution Model).该方法使用一系列标记点来表示形状,重要的是根据 ...

  8. CentOS 7 - 最小化安装后,解决无法使用yum命令问题!!

    刚刚最小化方式安装了CentOS 7 后,说实话,真不习惯也不喜欢纯shell方式工作,使用root账号登入后,马上想安装GNOME,但是发现yum不能正常工作!!! 一,输入安装X Window命令 ...

  9. 《图解HTTP》读书笔记(二:各种协议与HTTP协议之间的关系)

    涉及到DNS协议.TCP协议.IP协议,话不多说,上图:

  10. 用微信小程序连接leancloud数据库注意事项~

    具体步骤转载如下: 官网教程 大佬提示 注意事项: 1.下载的av-weapp-min.js,需要放在当前项目名称的子目录pages下 2.如上述教程,需要注册leancloud和AppID,并写在a ...