Question

每当我的一个或多个CKEditor WYSIWYG实例发生更改时，我都会为相应的textarea提供属性data-dirty="1"，因此我的应用程序知道它已更改。

我正在使用以下代码段：

$('textarea.wysiwyg').ckeditor(ckeditor_config, function () {
    var call_once = false;
    this.on('change', function () {
        if (this.checkDirty()) {
            if (!call_once) {
                $(this.element).attr('data-dirty', 1);
                $('#edit_form').change();
            }
            call_once = true;
        }
    });
});

除非用户仅通过Source Button编辑HTML，否则这很有效。在这种情况下，checkDirty()似乎没有被解雇。

有谁知道如何在编辑器的两个视图上使用此功能？我使用的是最新版本的CKEditor（CKEditor 4.5.7），完整版，因此插件是aswel的最新版本。

提前致谢。

Answer 1

正如documentation for the change event所述：

请注意change事件仅在wysiwyg mode中触发。为了在源模式中实现类似功能，您可以监听例如key事件或本机input事件（Internet Explorer 8不支持）。

editor.on( 'mode', function() {
    if ( this.mode == 'source' ) {
        var editable = editor.editable();
        editable.attachListener( editable, 'input', function() {
            // Handle changes made in the source mode.
        } );
    }
} );

如果您在一个页面中使用jQuery适配器和多个编辑器实例，可以尝试以下方法：

        $( '#editor1' ).ckeditor( function(){ this.on( 'mode', 
            function( evt ) {
                if ( this.mode == 'source' ) {
                    var editable = this.editable();
                    // Get the textarea
                    var element = $(this.element); 
                    editable.attachListener( editable, 'input', function( ev ) {
                        // Handle changes made in the source mode.
                        console.log( ev );
                        // Set an attribute on the textarea for handling
                        element.attr('data-dirty',1);

                    } );
                }
            }); 
        });

以上是callback function将在单个编辑器实例上执行，但如果指定选择器覆盖多个编辑器实例，例如.myeditor然后将侦听器附加到此方法创建的每个编辑器实例。

源编辑区域上的CKEditor checkDirty（）

1 个答案: