首页 编辑器 百度UEditor编辑器span标签以及div等标签被过滤的处理最终方法

百度UEditor编辑器span标签以及div等标签被过滤的处理最终方法

网上许多方式都试过,好些都不是完整方案,此方案为最佳解决方案,div等标签有时候在特殊布局是需要用上的。

辛辛苦苦写了一篇技术文章,将代码写上之后保存成功!然后编辑时发现只剩下符号!!!

原因:

ueditor编辑器在显示内容是自动过滤 部分 html 标签;

解决方法:

一:

打开 ueditor\ueditor.config.js 

搜索 'xssFilterRules ',

将 xssFilterRules,inputXssFilter,outputXssFilter 三项设置改为false;

二:

1,打开 ueditor\ueditor.all.js  文件

搜索 'defaultfilter':

在 UE.plugins['defaultfilter'] = function () {  }这个函数下直接 

加上 return;使ueditor编辑器默认过滤机制都不生效

2,打开 ueditor\ueditor.min.js 文件

搜索 'defaultfilter':

在UE.plugins.defaultfilter = function () {  } 这个函数下直接 

加上 return;使ueditor编辑器默认过滤机制都不生效

*前两点参考了( http://bbs.zhanzhang.baidu.com/thread-141449-1-1.html ; )内容,但是未根本解决本人在此项目的遇到的问题


三:(最终解决)如果以上操作还不能解决问题,就需要看 HTML 文本框代码了:

如图:

展示结果:

两个输出结果是不同的!网查询原因才知道UEditor支持textarea标签作为编辑器的外围容器,除此之外,UEditor还支持使用div和script标签作为其容器。

之所以要这样做,只是为了尽最大可能去满足和适应用户的各种不同需求。

官方推荐使用script标签的原因是textarea会在提交数据的时候自动对里面的部分html文本进行一次特殊字符转义,从而导致有些不熟悉的用户在再编辑的时候出现编码混乱的问题。

而使用script标签可以很好地克服这个缺点。

1

站心网

辛辛苦苦写了一篇技术文章,将代码写上之后保存成功!然后编辑时发现只剩下符号!!!原因:ueditor编辑器..

为您推荐

Web前端入门第 60 问:JavaScript 各种数组定义与数组取值方法

数组可以算是程序里面最常用的数据结构了,但凡网页上任何一个列表数据,基本都是以数组的形式存在,像表格、banner图、菜单列表、商品列表,分类列表等等,在前端领域都是以数组处理。数组的定义JS 的数组花样很多..

Web前端入门第 53 问:JavaScript 的各种调试方法

任何一门编程语言,在学习之前都应该先弄清楚它的调试方法,毕竟没有不挖坑的人类!程序一旦出现问题,第一时间就是找到问题出在哪儿,其次才是拿出解决办法。如果都找不到问题原因,那又何从谈起解决办法呢?如何排..

Web前端入门第 54 问:JavaScript 3 种书写位置及 script 标签的正确存放位置

JS 的代码并没有强制规定放在 HTML 中的某个位置,如果您有使用过开发者工具查看过网页源码,那么您会看到很多 JS 代码都以 .js 文件的形式存放,并且放在了 HTML 文件最后,也就是 </body> 结束标签之前。但如果仔..

从零实现富文本编辑器#3-基于Delta的线性数据结构模型

数据模型的设计是编辑器的核心基础,其直接影响了选区模型、DOM模型、状态管理等模块的设计。例如在quill中的选区模型是index + len的表达,而slate中则是anchor + focus的表达,这些都是基于数据模型的设计而来的。..

软件产品开发中常见的10个问题及处理方法

常见的10个问题#产品开发中常见的10个问题思维导图需求相关#1. 需求不明确#在日常工作中,需求来源于用户、老板、客户、竞品分析、业务部门、产品经理等,这些人或部门会提出需求,因为他们不是产品经理,提出的需求..

一个提升运营/营销转化率的万能方法!

之前,笔者有分享过说我最喜欢的增长是可复制可持续的增长,它一般都会有三个关键过程:首先是小范围测试,低成本试错,也就是最小可行性验证,让ROI最大化。然后是把测试的最优结果整理为可执行的标准化化流程。前..

学习最重要是方法,管理最重要是高度

技术学习要兼顾深度和广度夯实技术基础这么多年来,我面试了很多人。我越发感到「技术基础」非常重要。很多技术的本质是一样的。技术基础足够好的话,学东西可以非常快。往下到操作系统层面,甚至计算机硬件层面,你..

Java中String类常见的方法

以下介绍字符串常见的几个方法。介绍String类在 Java 中,String类是一个代表字符串的类,具有以下特性:不可变性:String对象一旦被创建就是不可变的,即它们的值在创建后不能被更改。任何对String对象的修改操作实..

.net 通过 HttpClient 下载文件同时报告进度的方法

通过 HttpClient 的 ContentLength 很多时候都可以拿到下载的内容的长度,通过 ReadAsync 可以返回当前读到的长度,将读取到的长度加起来就是已经下载的长度看起来很简单,于是直接给代码private static async Task ..

5个高性能 .NET Core 图片处理库推荐

在使用 .NET Core 开发中,图片处理是一个常见需求,如图像缩放、裁剪、格式转换和添加水印等。以下是一些推荐的 .NET Core 图片处理库,它们功能强大且支持多种图像处理功能:1. ImageSharp简介:ImageSharp 是一个..

javascript 6种连接数组的方法和对比

在 JavaScript 中,有多种方法可以用来连接数组,以下是常见的几种:1. concat() 方法用于连接两个或多个数组,返回一个新的数组,不修改原数组。const arr1 = [1, 2, 3];const arr2 = [4, 5, 6];const result = arr..

.NET开源ORM FreeSql常见问题和解决方法

FreeSql 是一个功能强大的 .NET 开源 ORM(对象关系映射)工具,支持多种数据库类型并提供丰富的功能特性。以下是使用 FreeSql 过程中常见的问题及其解决方法:1. 数据库连接问题问题描述:无法连接数据库,报错提示..

js 数组方法 - 修改篇

js数组方法可分为三类:修改、访问、迭代。修改:改变原有数组访问:不改变原有数组,从原有数组中获取数据迭代:对数组的每一项进行处理,返回数据本文主要介绍数组的修改篇一、增加1、push()含义:在数组末尾添加..

通过js修改tinymce的编辑器的内容

在网页开发中,TinyMCE是一个流行的富文本编辑器。它允许用户轻松地创建和编辑HTML内容,而无需直接操作代码。然而,有时我们可能需要通过JavaScript来动态修改编辑器中的内容。本文将介绍如何使用JavaScript来修改T..

sourcetree安装跳过注册方法

SourceTree下载提取码: ni9m 需翻墙或者破解注册当前只有Win的版本,Mac自行百度很多人用git命令行不熟练,那么可以尝试使用sourcetree进行操作。然鹅~~sourcetree又一个比较严肃的问题就是,很多人不会跳过注册或者..

.NET开发中常见的异常报错原因和解决方法?

在 .NET 开发中,常见的报错通常涉及代码编写、配置和运行时环境。以下是一些常见的报错类型及其解决建议:1. NullReferenceException原因:尝试访问空对象的成员。解决:在访问对象之前检查是否为 null,可以使用 C..

ASP.NET Core使用partial标签报错

在 ASP.NET Core 新增了 <partial> 标签支持,用于在 Razor 视图中简化渲染部分视图的语法。这一标签的用法直接写在 HTML 代码中即可,不需要使用 @Html.PartialAsync 语法,这样代码结构会更加清晰。<partial> 标签..

修改VisualSVN Server地址为ip地址,修改svn服务端地址为ip或者域名地址的方法

svn服务端搭建成功之后,地址太长很麻烦,想搞一个服务器专门做svn服务端,修改svn地址为ip地址无奈网上教程不靠谱,于是自己研究了下1.修改VisualSVN 的地址2修改地址并保存很多人不成功就在这里,点击确认之后复制..

Angular Mock 一个类的静态方法

理解 Angular Mock 和 静态方法在 Angular 单元测试中,Angular Mock 是一个强大的工具,它允许我们模拟和替换 Angular 的服务、组件和其他依赖项。而静态方法 是属于类本身,而不是类的实例的方法。它们可以直接通..

PDFiumCore | .NET Core PDF 处理渲染库

在处理 PDF 文件时,渲染和解析的准确性、速度和稳定性是至关重要的。PDFiumCore,作为.NET 环境下的一个强大库,为开发者提供了高效、便捷的 PDF 处理能力。PDFiumCore 是基于 Foxit Software 的 PDFium 库的一个封..

发表回复

返回顶部

微信分享

微信分享二维码

扫描二维码分享到微信或朋友圈

链接已复制