为KindEditor 添加“一键去除空格功能”
环境说明: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(/\ +/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 添加“一键去除空格功能”的更多相关文章
- JavaScript去除空格的三种方法(正则/传参函数/trim)
方法一: 个人认为最好的方法.采用的是正则表达式,这是最核心的原理. 其次.这个方法使用了JavaScript 的prototype 属性 其实你不使用这个属性一样可以用函数实现.但这样做后用起来比较 ...
- 一种简单的实现:Android一键换肤功能
现在的APP开发,通常会提供APP的换肤功能,网上流传的换肤代码和实现手段过于复杂,我把原作者的代码重新整理抽取出来,转换成Eclipse项目,重新整理成正确.可直接运行的项目. 代码运行结果如图. ...
- oracle中如何对字符串进行去除空格的方法
oracle中如何对字符串进行去除空格的方法 今天学习了一下oracle中如何对字符串进行去除空格的方法,这里总结一下.了解到的方法主要有两种:Trim函数以及Replace函数.下面我详细的介绍一下 ...
- JAVA之旅(十六)——String类,String常用方法,获取,判断,转换,替换,切割,子串,大小写转换,去除空格,比较
JAVA之旅(十六)--String类,String常用方法,获取,判断,转换,替换,切割,子串,大小写转换,去除空格,比较 过节耽误了几天,我们继续JAVA之旅 一.String概述 String时 ...
- 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 ...
- 3D打印机如何添加自动调平功能
原理说明 Kossel/Rostock等Delta(并联/三角洲)类型的机器,可以参考:http://learn.makerlab.me/guides/11 3d打印打印时最重要的是第一层的效果,如果 ...
- Tengine是由淘宝网发起的Web服务器项目。它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性
简介 Tengine是由淘宝网发起的Web服务器项目.它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性.Tengine的性能和稳定性已经在大型的网站如淘宝网,天猫商城等得到了很 ...
- phpcms编辑器添加一键排版控件
CKEditor添加一键排版插件实例,大家都知道phpcms也是ckeditor编辑器,那么如果增加这个一键排版这个牛逼功能呢增加好了后,效果图是这样的 废话不多说,直接说步骤第一步:config.j ...
- Android一键换肤功能:一种简单的实现
Android一键换肤功能:一种简单的实现 现在的APP开发,通常会提供APP的换肤功能,网上流传的换肤代码和实现手段过于复杂,这里有一个开源实现,我找了一大堆,发现这个项目相对较为简洁:htt ...
随机推荐
- PCB布局布线
1.关键芯片的物理位置,明细信号流向,防止关键信号交叉,高速线布线通畅. 2.可装配,可维修,可测试. 3.模拟电路和数字电路分区摆放. 4.疏密有序. 5.原理图应该明确主芯片周边元件的布局要求. ...
- Selenium 3----鼠标、键盘操作常用方法
[鼠标] 在 WebDriver 中, 关于鼠标操作的方法封装在 ActionChains 类中. ActionChains 类提供了鼠标操作的常用方法: perform(): 执行所有 Action ...
- 与eslint有关的规范
https://cloud.tencent.com/developer/section/1135682 腾讯云的规范还是不错的
- [dev][socket] unix domain socket删除socket文件
问题 在使用unix domain socket的时候,bind之后,会在本地路径里 产生一个与path对应的socket文件. 如何正确的在用完socket之后,对其销毁呢? 方案 使用 unlin ...
- SENG201 (Software Engineering I) Project
SENG201 (Software Engineering I) ProjectSpace ExplorerFor project admin queries:For project help, hi ...
- vim模式下报错E37: No write since last change (add ! to override)
故障现象: 使用vim修改文件报错,系统提示如下: E37: No write since last change (add ! to override) 故障原因: 文件为只读文件,无法修改. 解决 ...
- 软件开发项目组各职能介绍 & 测试人员在团队中的定位
前言 接触了许多非测试和新入行的测试从业者,听到最多的问题就是:“测试是否被需要?“ 团队职能介绍 <暗黑者1>中有句台词,“专案组有五个职能角色构成,侦探.网警.痕迹 ...
- 讨论mui 的 mui.init 与 mui.plusReady
先来看一段代码 (function(m, doc) { mui.plusReady(function(){ var self = plus.webview.currentWebview(); olti ...
- 前端 CSS 注释
/*开头 */ 结尾 /*这是注释*/ <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- LeetCode 15 输入无序、有重复,输出排重版 3-Sum
V1 粗暴的遍历,时间复杂度O(N³) func threeSumClosest(nums []int, target int) int { min := 0 result := 0 for i := ...