如何按类名将配置应用于文本区域

How do I apply configuration to textareas by class name?

本文关键字：应用于文本区域配置何按类更新时间：2023-09-26

>我有以下文件，我正在尝试用类名和给定的配置替换文本区域：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>CKEditor</title>
        <script src="//cdn.ckeditor.com/4.4.6/standard/ckeditor.js"></script>
    </head>
    <body>
        <textarea name="editor1" class="js-ckeditor"></textarea>
        <script>
            CKEDITOR.replaceAll( 'js-ckeditor', {
                removeButtons: 'Cut,Copy,Paste,PasteText,PasteFromWord,Undo,Redo,Anchor,Underline,Strike,Subscript,Superscript,Table,HorizontalRule,Smiley,SpecialChar,Maximize,Source,Indent,Blockquote,Styles,Format,About,SpellChecker',
                toolbar: [
                    { name: 'basicstyles', items: [ 'Bold', 'Italic', 'RemoveFormat' ] },
                    { name: 'resources', items: [ 'Link', 'Image' ] },
                    { name: 'list', items: [ 'NumberedList', 'BulletedList' ] }
                ],
                toolbarGroups: [
                    { name: 'group1', groups: [ 'basicstyles' ] },
                    { name: 'group2', groups: [ 'resources' ] },
                    { name: 'group3', groups: [ 'list' ] }
                ],
                removePlugins: 'resize,elementspath',
                removeDialogTabs: 'link:advanced;image:Link;image:advanced',
            } );
        </script>
    </body>
</html>

.. 问题是它在 CKEditor 实例中替换了文本区域，但它不应用配置。

但是，如果我这样做CKEDITOR.replace( 'editor1', {它会替换文本区域并应用配置。但就我而言，我需要用类名替换。我可以使用替换全部或其他方式将配置应用于元素吗？

你可以使用 jquery $.each 函数：

jQuery(document).ready(function() {
    $( ".ckeditor" ).each(function( index ) {
        CKEDITOR.replace($( this ).attr("id"),{
            //your configurations
        });
    });
});

请参阅CKEDITOR.replaceAll的文档。使用回调函数选择正确的文本区域子集并设置配置：

CKEDITOR.replaceAll( function( textarea, config ) {
    if ( new CKEDITOR.dom.element( textarea ).hasClass( 'js-ckeditor' ) ) {
        CKEDITOR.tools.extend( config, {
            removeButtons: 'Cut,Copy,Paste,PasteText,PasteFromWord,Undo,Redo,Anchor,Underline,Strike,Subscript,Superscript,Table,HorizontalRule,Smiley,SpecialChar,Maximize,Source,Indent,Blockquote,Styles,Format,About,SpellChecker',
            toolbar: [
                { name: 'basicstyles', items: [ 'Bold', 'Italic', 'RemoveFormat' ] },
                { name: 'resources', items: [ 'Link', 'Image' ] },
                { name: 'list', items: [ 'NumberedList', 'BulletedList' ] }
            ],
            toolbarGroups: [
                { name: 'group1', groups: [ 'basicstyles' ] },
                { name: 'group2', groups: [ 'resources' ] },
                { name: 'group3', groups: [ 'list' ] }
            ],
            removePlugins: 'resize,elementspath',
            removeDialogTabs: 'link:advanced;image:Link;image:advanced',
        } );
        return true;
    } 
    return false;
} );