Question

我的表单上有一个表单重置按钮：

<a href="#" id="reset_button" class="btn" onClick="name_of_form.reset();">Reset</a>

这会重置我的表单上除ckeditor之外的所有控件，我希望能够重置表单上ckeditors的值。

重置ckeditors的相关文本区域。

那么如何将ckeditor的重置代码编入表单重置按钮？

Answer 1

没有简单的方法可以将CKEditor与<textarea>同步。但是可以将<textarea>与CKEditor（editor.updateElement）同步。我首先将空数据设置到编辑器并调用editor.updateElement()以重置字段和编辑器：

... onClick="CKEDITOR.instances.theInstance.setData( '', function() { this.updateElement(); } )" ...

Answer 2

如果你想要一个更通用的解决方案，这里有一个小的jQuery插件，可以处理你网站上所有形式的所有重置按钮：

/**
 * This will fix the CKEDITOR not handling the input[type=reset] clicks.
 */
$(function() {
    if (typeof CKEDITOR != 'undefined') {
        $('form').on('reset', function(e) {
            if ($(CKEDITOR.instances).length) {
                for (var key in CKEDITOR.instances) {
                    var instance = CKEDITOR.instances[key];
                    if ($(instance.element.$).closest('form').attr('name') == $(e.target).attr('name')) {
                        instance.setData(instance.element.$.defaultValue);
                    }
                }
            }
        });
    }
});

此代码仅重置正在重置的表单的CKEDITOR实例。

Answer 3

$('#Reset').click("click", function (e) {
    CKEDITOR.instances.editor2.setData( '', function() { this.updateElement(); } )    
});

在表单重置按钮上重置ckeditor值

3 个答案: