CKEditor 5 链接：设置链接的默认目标或编辑目标

Question

在 CKEditor 5 中，我在链接对话框中看不到目标属性字段。

如何添加这样的字段？或者将 target=_blank 设置为默认值。 谢谢

Answer 1

自版本

11.1.0

Link Plugin 以来，添加了link decorator 功能。此功能提供了一种简单的方法来定义何时以及如何向链接添加一些额外属性的规则。

可能有手动或自动装饰器.

First 提供了一个 UI 开关，可以由用户切换。当用户编辑链接并切换它时，预配置的属性将添加到链接中，例如

target="_blank"

.

第二个，当从编辑器获取内容时自动应用。在这里，您需要提供一个回调函数，该函数根据链接的 URL 决定是否应应用给定的一组属性。

还有一个预配置的装饰器，可以用简单的

config.link.addTargetToExternalLinks=true

打开。它会将

target="blank"

和

rel="noopener noreferrer"

添加到以以下内容开头的所有链接：

http://

、

https://

或

//

.

Answer 2

在CKEditor Initialization Script中添加这段代码即可实现：

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        // ...
        link: {
            decorators: {
                openInNewTab: {
                    mode: 'manual',
                    label: 'Open in a new tab',
                    defaultValue: true,         // This option will be selected by default.
                    attributes: {
                        target: '_blank',
                        rel: 'noopener noreferrer'
                    }
                }
            }
        }
    } )
    .then( ... )
    .catch( ... );

这里是文档链接。它会工作正常。