web-dev-qa-db-ja.com

jQueryアダプターを使用して構成情報をCKEditorに渡すにはどうすればよいですか？

私は最新の CKeditor と jQueryアダプター を使用しています。

正常に動作し、表示されました。

ただし、CKeditorはまったく初めてなので、jQueryメソッドを使用して構成変数を渡すにはどうすればよいですか？

これは私が持っているものです

$( '#input-content' ).ckeditor('', {
    toolbar: 'basic'
});

私が読んだことから、最初の引数はコールバックであり、2番目の引数は構成であると考えています。しかし、これを行ってもエディターはまったく変わりません。

jQueryアダプターを使用して これらの構成プロパティ などを使用するにはどうすればよいですか？

javascriptjqueryckeditor
21
alex

空の関数を渡しました...

$('textarea#my').ckeditor($.noop, {
    property: 'value'
});
12
alex

私はこのコードを使用してこれを達成しました。うまくいけば、これが役立つでしょう。

これがhtmlです：

<textarea id="txtMessage" class="editor"></textarea>

そしてここにjavascriptがあります：

try {
        var config =
            {
                height: 180,
                width: 515,
                linkShowAdvancedTab: false,
                scayt_autoStartup: true,
                enterMode: Number(2),
                toolbar_Full: [['Styles', 'Bold', 'Italic', 'Underline', 'SpellChecker', 'Scayt', '-', 'NumberedList', 'BulletedList'],
                                ['Link', 'Unlink'], ['Undo', 'Redo', '-', 'SelectAll']]

            };

        $('textarea.editor').ckeditor(config);   }
19
Greg Randall
jQuery(function(){
        var config = {
            toolbar:
            [
                ['Bold', 'Italic', 'Underline', '-', 'NumberedList', 'BulletedList', '-', 'Undo', 'Redo', '-', 'SelectAll'],
                ['UIColor']
            ]
        };      
        jQuery('#textAreaElement').ckeditor(config);
    });
8
Rodrigo
var config = {
    toolbar:
    [
        ['Source','-','Save','NewPage','Preview','-','Templates'],
        ['Maximize', 'ShowBlocks','-','About']
    ],
    coreStyles_bold: { element : 'b', overrides : 'strong' }
};

それぞれの構成オブジェクトを追加するだけです。coreStyles_boldを追加した上で、「=」をCK APIドキュメントから「：」に変更するだけです。

2
tim
 $(document).ready(function(){
     $('.reply').click(
     function(event){
         // Event click Off Default
         event.preventDefault();
         // CKEditor
         $(function(){
             var config = {toolbar:[['Bold', 'Italic', '-', 'Link', 'Unlink']]};
            //<?php /*echo"var config = {toolbar:[['Bold', 'Italic', '-', 'Link', 'Unlink']]};" ;*/ ?>
             // DOM class = "cke"
             $('textarea.cke').ckeditor(function(){}, config);                
         });
         return false;
     });
 });
2
anonimo

これがCKEDITORの新機能であるかどうかはわかりませんが、私のソリューションを共有したいだけです（これを今探している人に役立つ場合に備えて）：

$("textarea.youreditor").ckeditor
(
    {
        customConfig: "/path/to/custom/config.js"
    }
);

...そして私の設定は次のようになります（単にデフォルトのconfig.jsをコピーしました）：

CKEDITOR.editorConfig = function(config)
{
    config.toolbar_Full =
    [
        { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
        { name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'] },
        { name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak','Iframe' ] },
        { name: 'colors', items : [ 'TextColor','BGColor' ] }
    ];  
};
0
nokturnal

公式ドキュメントがあります。 jQuery Adapter を参照してください。

Ckeditor（）メソッドは、2つのオプションのパラメーターを受け入れます。

  • エディターの準備ができたときに実行されるコールバック関数。
  • 作成されたエディターインスタンスに固有の構成オプション：
 $（ 'textarea'）。ckeditor（{
 uiColor： '＃9AB8F3' 
}）;
0
Wiktor Walc