Ckeditor删除空标签
CKEditor 是一款流行的开源 HTML 编辑器，用于简化 Web 内容创建和编辑过程。它支持多种编程语言和平台，提供了许多高级功能，如实时预览、拖放支持、HTML 模板、可配置工具栏等。
删除空标签
在 CKEditor 中，空标签可以通过在 HTML 中删除元素或属性来避免。以下是一些删除空标签的方法：
- 使用 CSS：在 CKEditor 的配置中添加一个自定义样式，将空
<span>标签设置为不显示。
ClassicEditor
.create(document.querySelector('#editor'), {
// ...
fontSize: {
options: [
'8px',
'10px',
'12px',
'14px',
'16px',
'18px',
'20px',
'24px'
]
}
})
.catch(error => {
console.error(error);
});- 使用 JavaScript：在创建编辑器实例时，通过
config.removeTags属性删除空标签。
ClassicEditor
.create(document.querySelector('#editor'), {
// ...
removeTags: {
remove: /^(<\/?[^>]*)$/,
allowed: ['p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6']
}
})
.catch(error => {
console.error(error);
});- 自定义配置：在创建编辑器实例时，通过
config.allowedContent属性设置允许的空标签。
ClassicEditor
.create(document.querySelector('#editor'), {
// ...
allowedContent: {
'*': {
'*': '*',
'*': '*',
'*': '*'
}
}
})
.catch(error => {
console.error(error);
});以上方法可以帮助你避免在 CKEditor 中出现空标签。你可以根据你的具体需求选择一种方法，并相应地配置编辑器。
相关·内容
2回答
我试图迫使CKE停止疯狂地修改我的HTML，并尝试引入我们自己的规则。
例如，CKE将删除空span和i标记，我们可以防止它使用
CKEDITOR.dtd.$removeEmpty.span = false
CKEDITOR.dtd.$removeEmpty.i = false
到目前一切尚好。然后，我们尝试使A标记能够支持块级元素(HTML5)，这也是通过操作DTD来实现的。
但现在看来，DTD对象还不足以满足我们的需要。例如，它正在删除空的A标签，而我不能阻止它，
CKEDITOR.dtd.$removeEmpty.a = false
不会起作用的。对于位于内容末尾的空BR标记，它也在做
浏览 0提问于2014-12-16得票数 1
1回答
我需要帮助允许CKEditor空标签。我知道我需要在配置文件中添加类似CKEDITOR.dtd.$removeEmpty['i'] = false的内容，但是在Drupal8.0.0安装中找不到这个文件。
我只想知道添加这一行以允许CKEditor空标记的正确位置。
浏览 0提问于2015-12-05得票数 2
回答已采纳
2回答
我现在使用的是CKEditor5
文本区域是：
<textarea class="form-control" name="post_content" rows="10" cols="30" id="editor"></textarea>
我想设置这个字段不能为空，所以尝试了我的‘必需’属性，但它使表单不能发送(到数据库)。
然后，我尝试停止我的表单发送内容到数据库，如果它是空的：(PHP)
if(!empty($post_content))
{
...create query and
浏览 4提问于2018-03-26得票数 2
每当我通过CKEditor添加HTML内容时，它都会自动在每个html标签的末尾添加一个"br“标签。
怎样才能删除它？
CKEDITOR.config.enterMode = CKEDITOR.ENTER_BR;
CKEDITOR.config.shiftEnterMode = CKEDITOR.ENTER_P;
CKEDITOR.replace(elemId,
{
resize_enabled: false,
entities: false,
basicEntities: false,
entities_greek: false,
entit
浏览 1提问于2012-10-11得票数 5
我使用的是CKEditor 4，它的默认设置似乎是使用<p></p>来表示空行。到目前为止，我总是看到以<p> </p> - ie为代表的空行。不是空标签。
因此，CKEditor表示空行的默认输出是，例如：
<p>paragraph before blank line</p>
<p></p>
<p>paragraph after blank line</p>
问题是，IE7、8、9似乎可以“正确”地将其显示为空行，而火狐和Chrome却不能--它们似乎忽略
浏览 0提问于2013-02-13得票数 21
回答已采纳
1回答
我在MVC应用程序中使用ckeditor 3.1。如果html标记是空的，那么它会在其中放置 。我希望允许div标记为空(<div></div>)，而不插入(<div> </div>)。我还使用了ckeditor的最新代码(3.3.1)，但同样的问题仍然存在。我们必须在任何特定的文件中进行一些手动更改吗？
请给我一个解决方案，允许使用ckeditor的空标签。
浏览 3提问于2010-07-06得票数 1
4回答
当用户插入空标签时，CKEditor会出现问题：
(在HTML源模式下)
<a href="fds" class="doIt"></a>
当他按下信号源，然后再按回来时，标签'A‘就消失了。我做了一点研究，我发现发生这种情况是因为ckeditor.js中有一个非常复杂的函数来检查元素内部是否有值。如果没有，CKEditor会丢弃标记。
浏览 0提问于2012-08-03得票数 9
据我所知，CKEditor会自动删除一个空的锚点。问题是，很多超文本标记语言插件都在使用空锚，并在页面加载后将它们存储在JavaScript中。
例如，如果我喜欢使用AddThis，他们会让我添加下面的代码：
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="
浏览 0提问于2013-04-14得票数 2
我正在为codeigniter项目使用ckeditor，当我尝试添加span标签时，它被替换为p标签。有没有办法用ckeditor添加span标签？
浏览 4提问于2014-09-16得票数 0
我在Drupal7上使用CKEditor，在一篇文章中我插入了一张带有热点的图片。我用ckeditor插入了html代码(完整的html模式，源代码视图)。现在我想向多边形添加工具提示，所以我尝试插入嵌套的title标签：
<polygon opacity="0" points="228,543 222,451 76,515 298,924 470,924 471,915"><title>removed by ckeditor</title></polygon>。
起初我认为它工作得很好，但当我重新打开ckedit
浏览 0提问于2017-09-05得票数 0
全。正如您所知道的，CKEditor以一个空的可编辑主体标记开始，如下所示：
<body contenteditable="true" class="someclasses">
</body>
我试图在这个body标签中用一个空的可编辑div启动CKEditor，并用这个div包装编辑器的所有内容：
<body class="someclasses">
<div contenteditable="true">
</div>
</body>
到
浏览 0提问于2018-09-10得票数 0
我使用的是<s> 3.6.4版本，由于ckeditor3.6.4标签已经过时，我想让编辑器使用ckeditor3.6.4。它现在允许我在编辑器中按下删除线按钮时添加<s></s>标签(在源代码模式下也是可见的)，但如果我保存更改，它们仍然不会显示在网站页面上。
我的config.js文件为空，我尝试添加
CKEDITOR.config.allowedContent = true;
CKEDITOR.editorConfig = function( config ) {}函数外部和此函数内部的config.allowedContent = true;。两者都
浏览 2提问于2016-01-11得票数 1
如何从CKeditor中删除空标签？我试过了：
Regex.Replace(clean, "(<[/a-zA-Z]+?)([^>]*?)(>)", "$1$3");
Regex.Replace(input, @"<([^>/][^>]*)>(( )*|\s*)</\1>", String.Empty);
config.allowedContent = true;
config.removeFormatAttributes = '';
在ckeditor的
浏览 5提问于2015-09-16得票数 2
我有从普通文本区域到ckeditor的CKEDITOR。我有一个可以切换的按钮，这样用户就可以使用普通的文本区或ckeditor。问题是，当我已经在ckeditor中有内容并切换到正常的文本区域时，在ckeditor被销毁后，html标签不会被删除。 图片链接来自CKEDITOR：https://ibb.co/hWRgDR3 当切换为普通文本区时：https://ibb.co/HPKBnPP 我已经尝试过CKEDITOR.remove和CKEDITOR.instance.idname.destroy() var ckEditorState = false; $('#editorSwi
浏览 20提问于2019-08-28得票数 1
我想把ckEditor集成到一个超文本标记语言的表单中。TextArea和SubmitButton应该在表单标签之外。
<form **id="myform"** action="example.com"></form>
<textarea **form="myform"** name="editor1" id="editor1" rows="10" cols="80">
This is my textare
浏览 0提问于2016-01-22得票数 1
我们有一个建立在Bootstrap上的网站。
某些超文本标记语言模块是由CkEditor维护的。
我们根据标准语法使用引导图标，例如：<i class="icon-envelope"></i>。
我们的问题: CkEditor将该语法解释为空标签集(即<i></i>)并将其删除。
因此，我们目前不能在CkEditor维护的任何HTML模块中使用Bootstrap图标。
有什么解决方案吗？谢谢!
浏览 0提问于2013-02-14得票数 1
我在Drupal 8中遇到了CKEditor的问题，我搜索了标编辑器增加额外的标签之类的相关问题，但是几乎所有的问题都与Drupal 7有关。
所以，当我点击enter而不键入任何内容时，我的CKEditor会自动应用一个<p> </p>。
📷
我怎么才能让这个失效？我不想删除填充或任何<p>标签。我需要检查段落是否是空的，然后不要显示它。
浏览 0提问于2017-10-11得票数 3
有时，用户会将不同来源的文本复制和粘贴到CKEditor，但我希望限制他们可以复制到CKEditor的标记。
我只需要在CKEditor中使用特定的标签:列表标签、断续标签等等.
我可以定义它们&禁用CKEditor中的其他标记吗？
浏览 3提问于2010-05-26得票数 27
回答已采纳
1回答
我使用CKEditor 4并有以下问题：
当网页打开且编辑器字段为空时，会发生这种情况。
我们只需输入文本，不改变样式(字体等)，但默认字体和大小不适用。所以结果将是
<html>some text</html>
而不是像这样
<html><span style="font-family: courier; font-size: 10pt">some text</span></html>
如果ckeditor打开，里面有一些现成的文本，一切都很好。
当ckeditor字段为空时，如何使默认字
浏览 0提问于2018-09-22得票数 0
我使用ckeditor版本4作为文本编辑器在我的网站上为用户，但我希望我的网站安全，所以这就是为什么我想禁用ckeditor源按钮…所以用户不能在我网站上添加任何类型的代码。
ckeditor config.js文件默认为空；自定义工具栏的设置是什么？
这是我使用ckeditor的文件：
<textarea name="article_content" id="article_content" rows="5" cols="50" style="width:90%; margin-bottom:15px;"&
浏览 2提问于2013-08-25得票数 7
当尝试通过状态栏删除所选元素时，下一个元素将与已删除的元素标签合并。
我已经尝试过了
CKEDITOR 4.0和最新的versionChrome 32.0
这个问题出现在CKEDITOR演示页面本身中
这只发生在Chrome浏览器的中。
如下图所示，我选择了H2标签。
我已经删除了那个H2元素，但是现在在H2标记中添加了下一个元素。
我怎样才能克服这个问题？
浏览 10提问于2014-01-23得票数 17
我希望CKEditor允许除了没有特定数据字段的图像标签之外的所有内容。例如data-test。
我试过文档上说的。目前还不允许所有的<img>标签。但它仍然可以接受所有图像。
config.allowedContent = {
$1: {
// Use the ability to specify elements as an object.
elements: CKEDITOR.dtd,
attributes: true,
styles: true,
classes: true
}
浏览 0提问于2018-05-15得票数 0
在Ckeditor中使用Yii扩展，我只想在数据库中插入数据，
一旦Ckeditor显示了它的良好但插入数据在Db与<p>标记本身。
例如,
<p>Sample</p>
插入Db
但我只想要Sample，而不是<p>和<br>标签等等。
浏览 1提问于2015-11-13得票数 0
回答已采纳
我刚刚开始使用cdn的CKEditor (最新版本4.5.7)，希望使用这个插件：
http://ckeditor.com/addon/uploadimage
我已经下载并提取了该插件的文件到'myplugins/uploadImage/‘。
<textarea name="editor1"></textarea>
<script>
CKEDITOR.plugins.addExternal( 'uploadImage'
浏览 0提问于2016-02-25得票数 5
回答已采纳
有人知道如何让advancedContentFilter在django-ckeditor配置设置中工作吗？我正在尝试过滤粘贴在p标签中的内容，以删除样式属性。我在settings.py中使用了以下代码，但它似乎没有注册。
CKEDITOR_CONFIGS = {
'allowedContent':'p',
}
浏览 1提问于2014-03-03得票数 4
当第一次尝试使用ckeditor时。ckeditor可以工作，但是当我尝试添加imageupload和uploadloadwidget插件时，我会得到错误：Uncaught TypeError:无法读取空的属性‘图标’
有没有人知道是什么原因造成的？
<script src="//cdn.ckeditor.com/4.5.6/basic/ckeditor.js"></script>
<script>
$(document).ready(function () {
CKEDITOR.plugins.addExter
浏览 6提问于2015-12-14得票数 12
我有html文本框和纯文本，有html代码样本存储在MySQL中。
我把textarea改为ckeditor类。一切都很好，但所有html代码块现在都不会以富文本模式显示。
我尝试过使用<pre>和<code>标记，但它们不起作用。
此外，我尝试了插入前插件，但它没有帮助。
有没有一种在CKEditor中显示/保存html代码的方法？如何使用代码示例按钮忽略块中的html标记？
我的示例.(对不起，还没有发布图像的权限)。
Textarea字段：
<textarea class="ckeditor" name = "description&
浏览 5提问于2014-02-05得票数 1
我想从网页中保存一些数据，为此，我想在我的页面中使用CKEditor。但是在加载页面之后，它显示的是普通的文本区域，而不是显示CKEditor。我遵循以下过程来使用它：
1下载ckeditor.zip文件，将其解压缩并放在public > js文件夹中。
2.然后，在我的主页的HEAD标签中，我使用了下面的一行来链接它：
<script type="text/javascript" src="{{ URL::asset('assets/js/ckeditor/ckeditor.js') }}"></script`>
浏览 7提问于2016-03-09得票数 0
回答已采纳
我有一个页面，其中我已经初始化了Bootstrap-WYSIWYG和CKEditor。
问题是CKEditor不断地将自己添加到Bootstrap-WYSIWYG中，即使我已经使用class="ckeditor"专门初始化了CKEditor。
我的代码如下：
<textarea class="ckeditor" name="editor1"></textarea>
该页面可在上找到
试着点击一个标签，上面写着“带有键盘快捷键的引导编辑器”、“写在哪里的”、“继续.”。这就引出了CKEditor onfocus，这太奇怪了！
浏览 4提问于2013-11-19得票数 5
回答已采纳
4回答
我正在使用ckeditor，我有各种奇怪的问题。
例如，它会自动删除空<span>
<span class="new-class"></span>
自动删除。
我已经寻找了2天的解决方案，但是没有成功。我试着把下面的代码放入
config.js
CKEDITOR.config.allowedContent = true;
但没有成功。
我还在html中添加了以下代码，其中我使用了ckeditor，但没有成功。
<script>
var editor = CKEDITOR.replace( 'editor1
浏览 116提问于2013-08-16得票数 20
回答已采纳
2回答
在我的项目中，Ckeditor是使用GWT编码的网页的一部分。所以CKeditor的接口是使用Java的。
无论何时显示网页，CKeditor都将通过setData()传递一个HTML，CKeditor应该显示该HTML。
问题是: CKeditor有时不会显示HTML。它的内容只是空的，尽管我非常确信html已经传递给了setData()。
我曾尝试过几种方法来解决这个问题，但没有一种可行。
我的方法
使用TextArea创建DOM.createTextArea()
调用myEditor=CKEDITOR.replace(textArea, config)初始化CKeditor
浏览 1提问于2016-05-13得票数 3
内联模式下的CKEditor在初始化时将文档源代码中的<br>添加到空div中。当您在CKEditor中检查源代码时，它显示为完全空。我猜这样做是为了停止折叠div或它正在编辑的任何元素，但对我来说，这会导致问题，因为我使用CSS将空div作为显示占位符的目标。
我到处都在寻找如何禁用它，很多年前我看到过FireFox的一些问题，但这似乎是无关的。
<div id="editarea" placeholder="Title"></div>
CKEDITOR.inline('editarea, {});
<sty
浏览 0提问于2017-06-26得票数 2
我一直在使用ckeditor，与ckeditor模块与ckeditor 4.4.3全文。以前，它工作得很好，突然就不起作用了，它在body字段中显示空白文本区域，如下所示。
📷
我试着重新安装ckeditor模块和库字段，但是结果没有改变.它看上去是空的，我找不到原因。我怎么才能和ckeditor一起工作。
以前，我的核心用户在我的文本段落中插入线高为1.6em的span元素，我不知道为什么。
底部显示体>p>跨跨。跨越1.6厘米的直线高度。
我怎样才能解决这个问题？
浏览 0提问于2014-08-07得票数 1
回答已采纳
有人知道如何禁用默认的CKEditor行为来更改RichCombo标签吗？我希望标签保持不变，不管用户选择。
浏览 2提问于2010-03-09得票数 0
回答已采纳
调用一个空的<mline />标记：
<math><mover align="right"><mn>0.16</mn><mline spacing="6" /></mover></math>
CKEditor不会将其识别为正确的空标记，因此无助地插入了结束标记</mline>，并弄乱了MathJax的解释：
<math><mover align="right"><mn>0.16</mn><
浏览 0提问于2015-12-08得票数 0
1回答
我在laravel中使用了ckeditor中的..但在保存文本后...laravel在网站中显示带有html标签的文本。像这样 <p>Hello</p> <label class="col-sm-2 col-form-label" for="simpleinput">پیشنمایش مطلب</label>
<div class="col-sm-10">
<text
浏览 16提问于2019-12-14得票数 0
10回答
当我不想要CKEditor的时候，我怎么才能在每次 时禁用它们呢？我正在使用带有jQuery适配器的CKEditor。
我不想要任何 标签。
浏览 0提问于2012-03-17得票数 44
回答已采纳
我试着允许所有html标记
<div> <p> <span> <i> /* etc */
和html属性，如下面(class，id)的例如：
<div id="foo" class="bar" style="z-index:1;">SOME COOL CONTENT HERE</div>
在监狱里。
我在docs.ckeditor.com里找到了类似的东西
config.allowedContent = {
$1: {
// Use the abili
浏览 3提问于2015-03-03得票数 26
回答已采纳
我正在尝试制作一个定制的CKeditor版本。我采用了完整的编辑器，删除了一些插件并添加了占位符。当把它放到我的页面上时，我会得到：
ckeditor.js:731 Uncaught TypeError: Cannot read property 'hasFocus' of undefined
at $.showBlock (ckeditor.js:731)
at Object.execute (ckeditor.js:799)
at $.<anonymous> (ckeditor.js:799)
at ckeditor.js:31
at Ob
浏览 19提问于2017-07-04得票数 2
回答已采纳
我目前正在使用CKEDITOR的内联编辑，我有一个大的问题，它。由于某种原因，CKEDITOR正在自动替换一些标签。到目前为止，我注意到我的"B“标签被改为”强“和”我“与"EM”。
如何在CKEDITOR中禁用标记替换？
我就是这样启动和使用CKEDITOR的
function ckEditorInit() {
$("#canvas.ckeditor-on").find("[edit='true']").each(function() {
CKEDITOR.dtd.$editable.span = 1;
浏览 5提问于2015-01-19得票数 0
我在Windows8.1OS中安装了VisualStudio2012Express，并根据需要在我的项目中使用CKEditor。
我是CKEditor的新手，也以适当的方式使用它，但问题是在CKEditor源代码中定义html，它会自动替换。
<div><i class="classname"></i></div>
使用
<div> </div> or <div></div>
那么，如何防止CKEditor不替换它并保存它呢？我已经找到了一些解决办法，但仍然有一些小
浏览 14提问于2015-10-16得票数 11
回答已采纳
不管出于什么原因，CKEditor 4正在从我的完整的HTML格式中剥离Google异步标记。
从这里开始(占位符取代ID)：
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
</script>
<!-- Top Banner -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
浏览 0提问于2013-12-18得票数 2
回答已采纳
1回答
我想从我的CKEditor中删除粗体按钮。我使用了下面提到的代码。但它只是将图标从工具栏中移除。我还想删除关键事件。当我按ctrl+b时，它是在后端放标签。
浏览 0提问于2019-07-25得票数 0
我在我的网站和网站上有博客页面，试图用CKEDITOR写内容，并从word复制它，但当内容公开时，html有太多额外的标签，这些标签是没有用的。我们如何过滤和删除额外的标签，只保存博客页面的主要html标签，谢谢
浏览 1提问于2018-09-23得票数 1
我使用的是CKEditor版本4.2.2的Drupal模块。当我切换“源”按钮(在纯文本和富文本之间切换)时，我最终丢失了一些标签。看起来CKEditor重写了HTML代码。到目前为止，我对此做了相当多的搜索，并在“自定义JavaScript配置”(在CKEditor模块的配置部分)中添加了这行代码：
config.allowedContent = true;
使用上面的代码，我已经部分成功了，现在除了以下代码之外，它留下了更多的标记：
<h2>404<i class="icon-file"></i></h2>
CKEditor将
浏览 1提问于2013-11-12得票数 1
我使用的是CKEditor，如果我单击“源”按钮并粘贴如下代码：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" />
</head>
<body>
<p>test</p>
</body>
</html>
然后再次点击源码，然后提交表单，html，head和，body标签被移除，只保留<p>test</p>！
CKEditor配置：
CKEDITOR
浏览 3提问于2016-03-16得票数 3
回答已采纳
1回答
在控制器级别，我在视图中使用了[ValidateInput(false)]和ValidateRequest="false"。
除了CKEDITOR删除<% %>标签之外，一切都很好。
我还遗漏了什么其他配置吗？
浏览 0提问于2010-03-09得票数 0
回答已采纳
我有一个表单，我用jQuery的.remove()删除了一些CKeditor实例化的文本区域，并通过这个函数添加了新的文本区域：
function addchapter() {
var randomnumber = Math.floor(Math.random()*9999);
var clone = $("#newchapter").clone(); //which is a hidden DIV containing the plain HTML to be added in form
$(clone).attr('id',rando
浏览 1提问于2012-06-13得票数 0
回答已采纳
1回答
我正在构建一个类似于pagemodo.com页面定制功能的功能。用户必须单击HTML页面中的标签( div )，CKEDITOR将加载到包含标签文本的单独div中。
现在，ckeditor正在加载标签文本，但是CKEDITOR的"KeyUp“事件没有触发。只有当"KeyUp“事件触发时，我才能调用另一个函数"readAsTyped”来同时更改标签中的文本。
您可以在此处查看工作副本
$(document).ready(function() {
$('.editable').click(function(){
$(t
浏览 0提问于2012-07-05得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
