0

我在权限决定您拥有的内容编辑级别的环境中运行 CKEditor。一项要求是为所有人显示按钮，但禁用某些按钮的点击事件。

我尝试了许多 jQuery 解决方案（attr、off、preventDefault、prop 等），但它们都不起作用，至少我是如何尝试的。

CKFinder 生成的示例 HTML，“添加图像”按钮：

<a id="cke_22" 
    class="cke_button cke_button__image cke_button_off " "="" 
    href="javascript:void('Image')" title="Image" tabindex="-1" hidefocus="true" role="button" aria-labelledby="cke_22_label" aria-haspopup="false" 
    onkeydown="return CKEDITOR.tools.callFunction(56,event);" 
    onfocus="return CKEDITOR.tools.callFunction(57,event);" 
    onmousedown="return CKEDITOR.tools.callFunction(58,event);" 
    onclick="CKEDITOR.tools.callFunction(59,this);return false;">

    <span class="cke_button_icon cke_button__image_icon">&nbsp;</span>
    <span id="cke_22_label" class="cke_button_label cke_button__image_label">Image</span>
</a>

我在他们的文档中找不到 CKEditor 解决方案，但我可能错过了一些东西。如果一些额外的 Javascript 可以破坏链接，我愿意接受 CKEditor 之外的修复。

4

2 回答 2

1

您需要使用 CKEditor API 来正确执行此操作。用 jQuery 禁用按钮是个坏主意，因为这样您不会阻止键盘快捷键、上下文菜单位置，并且还会破坏 a11y 功能（例如，使用键盘导航工具栏将被破坏）。

要禁用例如链接和图像功能，请使用以下代码：

CKEDITOR.replace( 'editor1', {
    on: {
        loaded: function( evt ) {
            var editor = evt.editor;

            editor.getCommand( 'image' ).on( 'state', function() {
                this.disable();
            } );
            editor.getCommand( 'link' ).on( 'state', function() {
                this.disable();
            } );
        }
    }
} );

它确保在每个状态更改命令上都被禁用。

提示：如果您不确定要禁用的命令的名称是什么，请检查editor.commands可能会给您一些想法的对象。

于 2013-03-24T12:42:31.847 回答
0

如果对您来说足够了，以图像为例，您可以简单地对所有处理程序进行核对。我不知道 CKE 是否真的会定期恢复它们，但如果不是，你可以做这样的事情

jQuery('.cke_button__image')
    .attr('onkeydown','')
    .attr('onmousedown','')
    .attr('onclick','');

它在 CKEditor 演示中工作。如果属性再次出现，只需重复该过程。请注意，这不是真正的安全答案。任何半体面的黑客都可以轻松绕过这些限制，但它会满足你的需求。

于 2013-03-23T01:46:01.423 回答