为什么我的自定义工具栏没有出现在我的 CKEditor 上

Question

我已经按照 CKEditor 网站上的教程进行操作，但我不明白为什么我的自定义工具栏没有出现在 CKEditor 上。最初我有所有的默认工具栏，但现在它已经恢复到只是一个文本区域。有人可以帮忙吗？代码如下：

$(function () {

    CKEDITOR.replace('txtBodyText', 
        config.toolbar=[
             { name: 'basicstyles', items: ['Bold', 'Italic', 'Underline'] },
             { name: 'list', items: ['NumberedList', 'BulletedList'] },
             { name: 'Indent', items: ['Outdent', 'Indent'] },
             { name: 'align', items: ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'] },
             { name: 'links', items: ['link', 'unlink;'] },
             { name: 'insert', items: [ 'Image', 'Table', 'HorizontalRule'] },
             { name: 'styles', items: [ 'Font', 'FontSize'] },
             { name: 'Clipboard', items: ['Cut', 'Copy', 'PasteText', 'PasteFromWord'},
             { name: 'undo', items: [ 'Undo', 'Redo'] },
             { name: 'tools', items: [ 'Maximise'] },
             { name: 'mode', items: [ 'Source'] }

        ]);
})


 <td class="prompt">Body</td>
            <td>
                <%: Html.TextArea("txtBodyText", Model.EmailTemplate.BodyText)%>
            </td>

Answer 1

这看起来不像是替换函数的有效第二个参数。这可能会有所帮助：

var configObject = {};
configObject.toolbar = [
    [ 'Source', '-', 'NewPage', 'Preview', '-', 'Templates' ],
    [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ],
    '/',
    [ 'Bold', 'Italic' ]
];
CKEDITOR.replace('txtBodyText', configObject);

看出两者的区别了吗？要替换的第二个参数必须是有效的 JavaScript 对象。您的示例中有错字：请参阅 unlink;？那不是真的正确:)。

Answer 2

CKEDITOR.replace() 接受要替换为编辑器和配置的元素的 ID。但是，您不需要写：

CKEDITOR.replace( 'txtBodyText', 
    config.toolbar=...

只用toolbar就够了，不用前面的config。而且，如上所述，您的 JavaScript 代码不正确（请注意您的 = 而不是 :）：

CKEDITOR.replace( 'txtBodyText',  {
    toolbar: ...
} );

在 CKEditor SDK 的示例中查看它是如何完成的，例如Custom Toolbar sample。向下滚动以获取示例的完整源代码。

不要忘记在更改任何编辑器配置后清除浏览器缓存！

Answer 3

我在底部多了一对托架。如果 Javascript 有问题，它不会运行整段代码。所以最好检查一下！

为什么我的自定义工具栏没有出现在我的 CKEditor 上

Why isn't my custom tool bar appearing on my CKEditor

html

asp.net-mvc

ckeditor