4

ckEditorを使用してロード時に背景色を動的に変更する必要があります。それが表示されているページは、ユーザーが特定のbgカラーを持っている動的にロードされているページです。cssを読み込めません。エディター本体の背景色だけである必要があります。

だから私は試しました

window.onload=function(){
    CKEDITOR.instances.editor_data.addCss( 'body { background-color: #efefef; }' );
}

エラーは発生しませんが、変更もありません

私も試しました

CKEDITOR.instances.editor_data.addCss( '#cke_editor_data { background-color: #efefef; }' );
4

2 に答える 2

17

window.load中にそれを呼び出す場合は遅すぎます。addCssは、エディターの作成時にロードするcssを定義しますが、実行中のインスタンスは変更しません。

したがって、これを行うことができます（addCSSのみを使用）：

CKEDITOR.on('instanceCreated', function(e) {
    e.editor.addCss( 'body { background-color: red; }' );
});

またはこれ（編集されたドキュメントを操作するためのより一般的な方法）

CKEDITOR.on('instanceReady', function(e) {
    // First time
    e.editor.document.getBody().setStyle('background-color', 'blue');
    // in case the user switches to source and back
    e.editor.on('contentDom', function() {
        e.editor.document.getBody().setStyle('background-color', 'blue');
    });
});
于 2012-07-09T17:42:53.043 に答える
1

上記の@AlfonsosMLの2番目の回答は、エディターの本体要素をターゲットにするのに最適です。しかし、私はエディター内でタグをターゲットにする必要があり、彼の最初の答えがそれを壊したことがわかりました。次に、コメントで@Doinによって提供された解決策を試しました：editor.document.addCssText（）これも失敗しました。@Doinはコメントのコードを親切に修正しましたeditor.document.appendStyleText()が、上に隠されていました。私は彼の訂正に「役に立つ」投票をしました。そうすれば、他の人にもっと早く見えるようになるでしょう。これは私のために働いた。私の作業コードは2を混合しました：

CKEDITOR.on('instanceReady', function(e) {
    // First time
    e.editor.document.getBody().setStyle('background-color', 'rgba(0,0,0,0.59)');
    e.editor.document.getBody().setStyle('color', 'white');
    e.editor.document.getBody().setStyle('text-align', 'center');
    e.editor.document.appendStyleText( 'a { color: white; }' );
    // in case the user switches to source and back
    e.editor.on('contentDom', function() {
        e.editor.document.getBody().setStyle('background-color', 'rgba(0,0,0,0.59)');
        e.editor.document.getBody().setStyle('color', 'white');   
        e.editor.document.getBody().setStyle('text-align', 'center');
        e.editor.document.appendStyleText( 'a { color: white; }' );
    });
});

ありがとうございました

于 2021-08-04T16:55:04.093 に答える