Question

我正在使用CKEditor 4.5.4并且我有一个按钮，使用此命令切换编辑器的只读状态：

var editor = CKEDITOR.replace( 'text', { height: '200px' });
editor.setReadOnly(false);

我想要做的是在编辑器处于read-only模式时使CKEditor内的所有链接都可以点击 - 当read-only为假时，我希望链接正常运行。

目前我正在努力使链接可以点击 - 检查它们我可以看到它们是有效的HTML（有时我认为CK编辑器中的链接只是带有下划线的蓝色文本） - 我假设CKEditor阻止这些链接的默认操作。这可以切换吗？

Answer 1

这是故意行为，因为打开链接会导致一些问题。以下是prevents opening links in read-only mode。

的代码部分

另请参阅https://dev.ckeditor.com/ticket/6032和https://dev.ckeditor.com/ticket/10912，了解更广泛的背景和此行为导致的问题。

您可以添加自己的链接处理程序，如：

var editor = CKEDITOR.replace( 'editor1', { readOnly: true } );

editor.on( 'contentDom', function() {
    var editable = editor.editable();
    editable.attachListener( editable, 'click', function( evt ) {
        var link = new CKEDITOR.dom.elementPath( evt.data.getTarget(), this ).contains( 'a' );
        if ( link && evt.data.$.button != 2 && link.isReadOnly() ) {
            window.open( link.getAttribute( 'href' ) );
        }
    }, null, null, 15 );
} );

使用HTML：

<textarea name="editor1" id="editor1" rows="10" cols="80">  
    <p>Foo Bar Baz <a href="http://ckeditor.com">CKEditor</a></p>
</textarea>

请参阅this codepen进行测试。您还可以添加其他检查以查看href是否为空，等等。

这不是一个完美的解决方案，因为理想情况下我们希望浏览器本地处理打开的点击链接。但是，在大多数情况下，它应该按预期工作。此外，它可能会导致一些安全问题，因为用户能够以任何方式操纵链接href（在编辑期间）。

CKEditor - 使链接可单击（在只读模式下）

1 个答案: