标签: ckeditor

有文档介绍如何设置高级内容过滤器的额外允许内容规则以及如何设置不允许的内容规则，但默认情况下允许的内容规则是什么？

stackoverflow 上也有类似的问题，但这些问题的答案对我不起作用，所以请不要将其标记为重复。

在我的 cms 中，我希望人们能够添加 SPA（单页应用程序）内容页面。此类应用程序通常只有一个具有某些属性的 div，并且使用 javascript 将应用程序加载到该 div 中。因此，我希望用户能够创建仅包含一个空 div 且具有如下属性的内容：

<div data-cscal-eventsource="default" data-cscal-height="550" id="eventCal" class="cs-eventcal"></div>

然而ckeditor（我现在使用的是4.6.2版本）总是删除空的div。通过谷歌搜索并在这里找到类似的问题，我在配置中尝试了各种方法：

allowedContent : true

应该关闭所有过滤，但它仍然被删除。

CKEDITOR.dtd.$removeEmpty['div'] = false;

在一些答案中也找到了，但对我不起作用。

在将 allowedContent 设置为 true 之前，我尝试使用 extraAllowedContent 进行各种操作，如下所示：

extraAllowedContent: 'div(*){*}[*]; ol li span a(*){*}[*]'

如果 div 有一些文本，它的工作方式如下：

<div data-cscal-eventsource="default" data-cscal-height="550" id="eventCal" class="cs-eventcal">hello</div>

但我不想要该文本，并且使用 nbsp 也不起作用。

我怎样才能让 CKEditor 留下我的空 div 呢？我的 div 是编辑器中的唯一内容，我的 SPA 的脚本和 css 是从编辑器外部添加的。我只需要能够添加 div 而不将其删除。我正在尝试使用 sourcedialog 添加 div。

我不想修改 ckeditor 源代码来解决这个问题。

为了清晰起见，我的完整代码是这样的，您可以在评论中看到我尝试过的一些事情：

(function ($) {

var xsrfToken = $('[name="__RequestVerificationToken"]:first').val();
var dfUrl …

CKEDITOR与<textarea>标签一起使用时，它不起作用。

 <textarea id="editor1" name="description" class="form-control" cols="10" rows="10" required></textarea>

 <script>
      CKEDITOR.replace('editor1');
 </script>

任何建议？

我正在尝试弄清楚如何验证编辑器中的内容，例如，确保内容长度至少为 200 个字符。通常，使用常规文本区域，我可以检索该值并从那里验证它。据我了解，这件事并不那么容易。

我在我的 Angular 7 项目中使用 CKEditor 5。我已遵循官方文档，并在编辑器内容更改时使用'ChangeEvent'检索数据。现在我想每当单击“保存”按钮时检索数据。

1. 我的CKEditor工具栏没有保存按钮，如何添加？

2. 当我点击保存按钮时如何检索数据？

3. 我想在表单中使用CKEditor，以便在单击提交按钮时检索数据。如何实现这一目标？

这是html代码：

<ckeditor [editor]="Editor"  (change)="onChange($event)"  >
</ckeditor>
<button (click)=save()>Save</button>

这是打字稿：

public Editor = ClassicEditor;

public onChange( { editor }: ChangeEvent ) {
const data = editor.getData();
console.log( data );
}

save(){
const data = this.Editor.getData();
console.log( data );
}

提前致谢。

我尝试了 ckeditor 5 自定义工具栏按钮的角度方法，但都出现错误，有像https://www.npmjs.com/package/@samhammer/ckeditor5-simple-button-plugin这样的插件，但我不知道如何使用它ckeditor5-角度

我正在尝试将 ckeditor 集成到我的 django 博客应用程序中。我严格遵循 django-ckeditor github 页面中的所有说明。即安装、添加到已安装的应用程序、添加到 URL、收集静态文件、在 settings.py 中配置设置并在必要时在模型中导入 ckeditor.fields。当我尝试进行迁移或运行时，出现以下错误：

Watching for file changes with StatReloader
Exception in thread django-main-thread:
Traceback (most recent call last):
  File "/usr/lib/python3.6/threading.py", line 916, in _bootstrap_inner
    self.run()
  File "/usr/lib/python3.6/threading.py", line 864, in run
    self._target(*self._args, **self._kwargs)
  File "/home/kush/projects/venv/lib/python3.6/site-packages/django/utils/autoreload.py", line 54, in wrapper
    fn(*args, **kwargs)
  File "/home/kush/projects/venv/lib/python3.6/site-packages/django/core/management/commands/runserver.py", line 109, in inner_run
    autoreload.raise_last_exception()
  File "/home/kush/projects/venv/lib/python3.6/site-packages/django/utils/autoreload.py", line 77, in raise_last_exception
    raise _exception[1]
  File "/home/kush/projects/venv/lib/python3.6/site-packages/django/core/management/__init__.py", line 337, in execute
    autoreload.check_errors(django.setup)()
  File "/home/kush/projects/venv/lib/python3.6/site-packages/django/utils/autoreload.py", line 54, in wrapper
    fn(*args, **kwargs) …

像很多人一样，我正在开发一个简单的 Android 应用程序，它只是一个Webview，可以打开我的完整响应式网站，只是为了允许找到它、安装它并像“真正的”应用程序一样启动它（我知道你知道为什么我正在这样做！）。我的网站使用CKEditor允许用户创建简单的 html 页面并上传图像以放入其页面中。为此，我将响应式文件管理器与 CKEditor 结合使用，如果我从手机 (Android 9) 上的 Chrome 或其他浏览器打开我的网站，则一切正常。但是当我启动我的 Web 应用程序时，即使 90% 的网站工作正常，日志中也会出现几个 Javascript 错误，例如：

I/chromium: [INFO:CONSOLE(305)] "Uncaught TypeError: $(...).fancybox is not a function" 
I/chromium: [INFO:CONSOLE(1)] "Uncaught TypeError: Cannot read property 'tools' of undefined" (it refers to this source code --> window.opener.CKEDITOR.tools.callFunction(a, e) )

当我尝试使用“上传图像”或“选择图像”功能时，由于上述 Javascript 错误，它不起作用（当我单击操作按钮时它不执行任何操作）。

我已经启用了 Javascript、dom 存储并使用 webview 设置访问所有文件和文档，正如其他类似问题中所建议的那样，但对我来说没有任何作用。

我的超级简单的 Android 应用程序：

public class MainActivity extends Activity {
    private WebView mWebView; …

我在我的网站上使用 CKEditor 5，以便允许用户为其公司生成 PDF 模板。

我的问题是，一旦我从 ckEditor 中取出数据，每个样式元素都有一个 class="CSS-Class-Here"，这是有问题的，因为当我将 CKEditor 的 HTML 内容转换为 PDF 时， PDF 不知道这些类中的任何一个。

有没有办法让 CKEditor 将这些类保存为内联样式？

我知道可以为特定样式的特定元素创建插件，但我希望一切都以这种方式运行，而不是特定的东西。

此外，不可能将样式直接注入 PDF 本身，因为 ckEditor 将样式保留在 javascript 函数中并根据需要创建它们。

例如：黄色突出显示的文本显示为： <mark class="" marker-yellow "">Random Text</mark>

我希望它的结果是： <mark style="background: yellow">Random Text</mark>

这意味着标记黄色类中存在的样式应该直接内联应用于元素本身。

我正在尝试向 CKEditor5 的经典版本添加一个插件。我已按照此页面上的说明进行操作： https://ckeditor.com/docs/ckeditor5/latest/installation/plugins/installing-plugins.html

我可以说我已经正确完成了所有事情，因为当我打开sample/index.html.

现在是时候将此自定义构建与我的 React 应用程序集成了。

此页面上的说明“描述”了要做什么：

您将在项目旁边的某个位置创建一个新构建，并将其包含在内，就像包含现有构建之一一样。

它说“像包含现有版本之一一样包含它”。好吧，这就是我包含经典构建的方式：

import React from "react";
import ReactDOM from "react-dom";
import CKEditor from "@ckeditor/ckeditor5-react";
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";

import "./styles.css";

function App() {
  return (
    <div className="App">
      <CKEditor
        editor={ClassicEditor}
        // Other Props
        }}
      />
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

所以，我假设我会做这样的事情：

import React from "react";
import ReactDOM from "react-dom";
import CKEditor from "@ckeditor/ckeditor5-react";
import ClassicEditor from './ckeditor/ckeditor'


import "./styles.css";

function App() {
  return ( …