Question

在TinyMCE 4中，我使用标准formatselect控件来格式化内容中的块元素。它的配置通常看起来像这样：

block_formats: 'Paragraph=p;Header 1=h1;Header 2=h2'

我有这些块的自定义样式，无论编辑器生成的HTML到底在哪里，我都需要保留样式。主题中的content.min.css可以控制块在编辑器中的外观，而不是其他地方，所以我不能依赖它。所以我使用自定义格式而不是标准块格式。我的配置如下所示：

block_formats: 'Normal=normal;Header 1=header1;Header 2=header2',
formats: {
    normal: {block: 'p', styles: {
        'font-family': '"Helvetica Neue",Helvetica,Arial,sans-serif',
        'font-weight': 'normal',
        'font-size': '13px',
        'line-height': '20px',
        'color': '#333'}},
    header1: {block: 'h1', styles: {
        'font-family': '"Helvetica Neue",Helvetica,Arial,sans-serif',
        'font-weight': 'normal',
        'font-size': '30px',
        'line-height': '40px',
        'color': '#333'}},
    header2: {block: 'h2', styles: {
        'font-family': '"Helvetica Neue",Helvetica,Arial,sans-serif',
        'font-weight': 'normal',
        'font-size': '20px',
        'line-height': '30px',
        'color': '#333'}}
},

通过在生成的HTML元素中嵌入样式，实现了我的目的。但是在使用我不理解的自定义格式时，行为会有一些变化。

使用默认块格式时，默认情况下，当内容为空时以及创建新块时，将选择段落。使用自定义格式时，它不会选择默认的块格式，因此默认情况下不使用任何自定义样式。我希望normal成为默认值。我怎样才能做到这一点？

Answer 1

这可能非常晚了，但我想我能够以适合你的方式解决这个问题。希望有人觉得这很有用。

（使用tinyMCE：4.3.13）

在我的情况下，我在一个模态中显示一个tinyMCE实例。模态可用于创建或编辑然后以html格式保存到数据库的文本。我遇到的问题是在创建新的文本实例时，默认情况下会删除一个p标记（假设您添加一些内容），这不会反映他们正在查看的当前样式。后来，我需要将这个html渲染成一个图像，所以当我渲染它时，样式必须出现在标签上，并且格式为＆＃39; object不会影响它，因为用户没有通过UI选择它。然后，用户可以创建在图像中显示不同的结果html，因为渲染的Web-Kit没有正确的css，因此只是呈现其默认值。

因此，要强制它显示初始样式（字体大小和字体系列是我的顾虑），您只需设置编辑器的初始内容即可。如果没有可用于编辑的html，我会在向用户显示模态之前执行此操作。

tinymce.activeEditor.setContent('<p><span style="font-family: arial; font-size: 8pt;">&nbsp;</span></p>');

当然，可以先检查浏览器版本，以确保设置可接受的值。

希望这有帮助。

<强> [UPDATE] *这是一个失败！编辑器将呈现默认字符并将光标放在焦点上。这会通过设计产生错误的编辑。（想象一下，我在文本上强加了默认的＆＃39;下划线样式）

因为我创建了一个空格，所以下划线的空格现在会出现在编辑器中。如果用户按下退格键以删除该空格，则可以。但是，如果用户再次按退格键，则会删除格式。这不是解决办法。

要解决此问题，您需要将tiny设置为不验证html。不幸的是，它将无法呈现出色的HTML。您无法切换验证。我认为这应该改变。我们需要能够仅将内容注入样式。我会买票。

https://github.com/tinymce/tinymce/issues/3126

TinyMCE 4：自动将一种块格式应用于新块

1 个答案: