wangEditor增加自定义菜单，去除html（word）样式，只保留文字_wangeditor5工具栏添加样式-程序员宅基地

技术标签： wangeditor wangEditor 自定义菜单 wangEditor wangEditor 去除html样式 wangEditor去除word样式

如下：1、qgs 是我自定义的工具栏菜单属性，如果是自定义菜单配置加上qgs菜单
var editor = new E(’#editor’);
editor.customConfig.debug = true;
editor.customConfig.menus = [
‘head’, // 标题
‘bold’, // 粗体
‘fontSize’, // 字号
‘fontName’, // 字体
‘italic’, // 斜体
‘underline’, // 下划线
‘strikeThrough’, // 删除线
‘foreColor’, // 文字颜色
‘backColor’, // 背景颜色
‘list’, // 列表
‘justify’, // 对齐方式
‘image’, // 插入图片
‘table’, // 表格
‘undo’, // 撤销
‘redo’, // 重复
‘qgs’ // 去格式
];
2、wangEditor.js
菜单配置工具栏，加上我自定义的qgs菜单
var config = {

// 默认菜单配置
menus: ['head', 'bold', 'fontSize', 'fontName', 'italic', 'underline', 'strikeThrough', 'foreColor', 'backColor', 'link', 'list', 'justify', 'quote', 'emoticon', 'image', 'table', 'video', 'code', 'undo', 'redo','qgs']｝

3、
/*
qgs-menu
*/

在这里插入图片描述
4、//原型写自己的菜单事件的实现业务逻辑
Qgs.prototype = {
constructor: Qgs,

// 点击事件
onClick: function onClick(e) {
	 // 点击菜单将触发这里

    var editor = this.editor;
    var str = editor.txt.html();
    str = str.replace(/<xml>[\s\S]*?<\/xml>/ig, '');
    str = str.replace(/<style>[\s\S]*?<\/style>/ig, '');
    str = str.replace(/<\/?[^>]*>/g, '');
    str = str.replace(/[ | ]*\n/g, '\n');
    str = str.replace(/&nbsp;/ig, '');
    editor.txt.html(str);
},

// 试图改变 active 状态
tryChangeActive: function tryChangeActive(e) {
    var editor = this.editor;
    var $elem = this.$elem;
    if (editor.cmd.queryCommandState('qgs')) {
        this._active = true;
        $elem.addClass('w-e-active');
    } else {
        this._active = false;
        $elem.removeClass('w-e-active');
    }
}

};

5、
// 存储菜单的构造函数，加上 MenuConstructors.qgs = Qgs;
var MenuConstructors = {};

MenuConstructors.bold = Bold;

MenuConstructors.head = Head;

MenuConstructors.fontSize = FontSize;

MenuConstructors.fontName = FontName;

MenuConstructors.link = Link;

MenuConstructors.italic = Italic;

MenuConstructors.redo = Redo;

MenuConstructors.strikeThrough = StrikeThrough;

MenuConstructors.underline = Underline;

MenuConstructors.undo = Undo;

MenuConstructors.list = List;

MenuConstructors.justify = Justify;

MenuConstructors.foreColor = ForeColor;

MenuConstructors.backColor = BackColor;

MenuConstructors.quote = Quote;

MenuConstructors.code = Code;

MenuConstructors.emoticon = Emoticon;

MenuConstructors.table = Table;

MenuConstructors.video = Video;

MenuConstructors.image = Image;

MenuConstructors.qgs = Qgs;

总结：通过上面的环节就实现的去html格式的功能菜单
在这里插入图片描述

本文链接：https://blog.csdn.net/chenshifan668/article/details/101616107

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

高性能电工电子电气控制技术实训考核装置_示波器、晶体管和射极跟随器、运算放大器、正反馈和振荡器-程序员宅基地

文章浏览阅读1.4k次。ZN-800CGXK高性能电工电子电气控制技术实训考核装置一、概述ZN-800CGXK高性能电工电子电气控制技术实训考核装置是我公司吸收国内外同类产品合理的实训方法，先进、合理、科学的实训手段并加以消化、整合、提高而研制的新一代实训装置。实训内容根据教育部"振兴21世纪职业教育课程改革和教材建设规划"的要求，并按照职业教育的教学和实训要求而设定，涵盖"电路分析"“电工基础”“电工学”“模拟电子技术”“数字电子技术”“电机控制”“继电接触控制”"常用生产机械电气控制"等课程的实训大纲要求，ZN-800CG_示波器、晶体管和射极跟随器、运算放大器、正反馈和振荡器

nagios监控日志脚本check_logfile-程序员宅基地

文章浏览阅读144次。nagios 自带的Plugin check_log监控日志比较单一，对于对日志监控比较高的生产环境下还是不行的。consol.de 出的check_logfile很不错很强大，支持正则表达式。详细官方说明如下:http://labs.consol.de/lang/de/nagios/check_logfiles/我以监控apache日志为例..._nagios 脚本抓取日志输出关键字

Android build.prop参数详解_build.prop详解-程序员宅基地

文章浏览阅读1.8w次，点赞9次，收藏40次。前言 build.prop是Android系统中的一个重要的属性文件，它记录了Android系统运行的很多配置信息，当程序运行时需要某种系统状态时，会到该模块中进行读取，类似Window中的注册表对少量配置信息进行存储，改变它能够取得一些意想不到的效果，但是也正是因为.prop的重要性，如果不明白具体的含义的话，绝对不要随便动它。build.prop参数详解# beg_build.prop详解

CSS3引入外部字体（苹方字体下载链接）_css3 pingfang字体下载-程序员宅基地

文章浏览阅读7.1k次，点赞2次，收藏2次。pingfang链接： https://pan.baidu.com/s/1vyxkN-Edg17gVPHlnFoqsA提取码：zwk0CSS3引入代码：等待引入的文件@font-face { font-family: 苹方黑体-准-简; src: url(../fonts/苹方黑体-准-简.ttf);}*{ font-family: 苹方黑体-准-简;}..._css3 pingfang字体下载

开发java超级玛丽的素材_超级玛丽完整素材-程序员宅基地

Tiptop T100鼎捷智能物流平台 Tiptop GP鼎捷智能物流平台鼎捷APP二维码整体解决方案鼎捷APP 鼎捷移动解决方案鼎捷安卓PDA扫码方案鼎捷WMS 鼎捷二次开发提供源码-程序员宅基地

文章浏览阅读320次。Tiptop T100鼎捷智能物流平台 Tiptop GP鼎捷智能物流平台鼎捷APP二维码整体解决方案条码管理系统鼎捷ERP移动解决方案鼎捷WMS仓库移动扫码鼎捷安卓PDA扫码方案。支持鼎捷Tiptop T100、Tiptop GP平台二次开发，已经在十多家企业在使用此产品，欢迎更多企业使用。网盘下载APP、webservice源码更多信息。

随便推点

conda 环境里使用pip安装成功的包，无法使用，找不到。_no module named 'addict-程序员宅基地

文章浏览阅读7.2k次，点赞3次，收藏13次。我在conda创建的环境A里面使用pip安装了addict。我的环境是python3.6pip install addict 显示安装成功后，还是显示no module named addict。系统的pip路径：/usr/local/lib/python3.6/dist-packages找到此安装包addict的路径,一般情况下安装的包在系统的pip路径下，conda 的环境A的..._no module named 'addict

基于java中的springboot框架实现学生宿舍管理系统的设计与开发演示【附项目源码+论文说明】_基于springboot的宿舍管理系统论文-程序员宅基地

文章浏览阅读1.2k次，点赞30次，收藏19次。所以各行业，尤其是规模较大的企业和学校等都开始借助互联网和软件工具管理信息，传播信息，共享信息等等，以此可以增强自身实力，提高在同行业当中的竞争能力，并从各种激烈的竞争中获取发展的机会。针对学生宿舍信息管理混乱，出错率高，信息安全性差，劳动强度大，费时费力等问题，经过分析和考虑，在目前的情况下，可以引进一款学生宿舍管理系统这样的现代化管理工具，这个工具就是解决上述问题的最好的解决方案。宿管员管理公寓资产，缴费信息，公共场所清理信息，日常事务信息，审核学生床位安排信息。其具体的操作流程见下图。_基于springboot的宿舍管理系统论文

C++学习关键字&标识符命名规则_c++命名规范总结-程序员宅基地

文章浏览阅读262次。关键字列表不用记，用多了自然就会了。_c++命名规范总结

2020年12月 Scratch图形化（四级）真题解析#中国电子学会#全国青少年软件编程等级考试-程序员宅基地

文章浏览阅读262次，点赞3次，收藏3次。罗马共和国的恺撒曾经用一种特殊的加密方式和他的将军们联系，他是这样做的：把一个单词里的每一个字母都向后移，比如A向后移3位，变成D，B就变成E，以此类推。外公家的谷仓进了老鼠，小智制作了一只小机器猫在谷仓巡逻驱鼠：下图是谷仓的平面图，每个格子的宽度是30，小猫能够经过每个格子。数学课上老师刚刚讲了正多边形的内角规律，小宇想要制作一个输入边数，就能够画任意正多边形的新积木，请问下面哪段程序能够满足他的要求？点击绿旗，a的值为“海绵宝宝”，b的值为“派大星”，c的值为“章鱼哥”。比如输入：“khoor”，

Vue中鼠标悬停更换图片/文字内容，动态展示/修改某些属性_vue span动态更改文字内容-程序员宅基地

文章浏览阅读3.4k次，点赞5次，收藏16次。Vue中鼠标悬停更换图片/文字内容，动态展示/修改某些属性鼠标悬停时：@mouseenter 鼠标离开时：@mouseleave利用以上来绑定相应方法，例如：<div @click="finance" @mouseleave="changeImageSrc(1, '')" @mouseenter="changeImageSrc(1, 'hover')"> //分别为鼠标悬停时和离开时绑定方法changeImageSrc，并传递参数 <img :src="ci_vue span动态更改文字内容

spring 相关问题收集_at com.fasterxml.jackson.databind.deserializationc-程序员宅基地

文章浏览阅读187次。1.使用resttemplate发送请求，反序列返回的object时报错.代码如下：@Data@AllArgsConstructorpublic class UsageRecordId { private UUID id;}请求如下： UsageRecordId responseEntity = restTemplate.postForObject(HTTP_LOCALHOST + port + urmPath, requestBody,UsageRecor.._at com.fasterxml.jackson.databind.deserializationcontext.handlemissinginstan