0

CKEditorの代わりに独自の画像プラグインを実装しようとしています。http://docs.ckeditor.com/#!/guide/plugin_sdk_sample_1のチュートリアルから実装をブートストラップしました

現在、編集可能な属性はsrc

以下のコードでは$.imagebrowser.openPopup(callback)、ユーザーが選択を行うとポップアップを開き、画像の新しいsrc属性を使用してcallbackを呼び出します。

これは挿入と編集の両方で問題なく機能しますが、元に戻る/やり直しの統合には問題があります。ダブルクリックによって行われたsrc属性の変更は、他の変更が発生するまで元に戻せません（テキストの入力など）。次に、src属性の変更がundo / redoスタックに適切に統合されているようで、元に戻したりやり直したりできます。

私が間違っていることについて何か考えはありますか？

CKEDITOR.plugins.add( 'customimage', {

    // Register the icons. They must match command names.
    icons: 'customimage',

    // The plugin initialization logic goes inside this method.
    init: function( editor) {
        editor.on( 'doubleclick', function( event ) {
            if(event.data.element.getName() == "img") {
                $.imagebrowser.openPopup(function(src) {
                    event.data.element.setAttribute("src", src);
                });
            }
        });

        editor.addCommand( 'insertCustomimage', {
            allowedContent: ['img[!src,alt]{width,height,float,margin}'],
            // Define the function that will be fired when the command is executed.
            exec: function() {
                $.imagebrowser.openPopup(function(src) {
                    editor.insertHtml('<img src="' + src + '" style="width: 400px; height: auto; float: left; margin: 10px 10px;">');
                });
            }
        });

        // Create the toolbar button that executes the above command.
        editor.ui.addButton( 'Customimage', {
            label: 'Image',
            command: 'insertCustomimage',
            toolbar: 'insert'
        });
    }
});
4

1 に答える 1

2

これがあなたが探しているものかどうかはわかりませんが、スナップショットを作成することはできます。

editor.fire( 'saveSnapshot' );

これにより、Undo/redoスタックに状態が追加されます。このコマンドは、次の行の前に追加する必要があります。

event.data.element.setAttribute("src", src);

editor.insertHtml（）関数には、これが関数に含まれています。ただし、タグを編集している場合は、これを手動で行う必要があります

于 2013-03-26T16:53:22.000 に答える