27

我有一个自定义编写的 CMS，它使用CKEditor *(FCKEditor v3) 来编辑内容。我还使用jQuery Validation插件在基于 AJAX 的提交之前检查所有字段是否有错误。我正在使用serialize()函数将数据传递到 PHP 后端。

问题是，序列化设法正确抓取所有字段，除了在 CKEditor 中键入的实际内容。与其他所有 WYSIWYG 编辑器一样，这个编辑器也将 iframe 覆盖在现有文本框上。并且序列化忽略 iframe 并且只查看文本框的内容，当然，它没有找到，因此返回一个空白的内容正文。

我的方法是在 CKEditor 的onchangeCKEDITOR.instances.[textboxname].getData()事件上创建一个钩子，并使用编辑器中的任何更改同时更新文本框（返回内容）或其他一些隐藏字段。

但是，由于 CKEditor 仍处于 beta 阶段并且严重缺乏文档，我找不到合适的 API 调用来让我这样做。

有谁知道如何解决这个问题？

4

11 回答 11

36

另一个通用解决方案是在您尝试提交表单时运行以下命令

for ( instance in CKEDITOR.instances )
            CKEDITOR.instances[instance].updateElement();

这将强制表单中的所有 CKEDITOR 实例更新它们各自的字段

于 2010-01-05T16:28:15.043 回答
7

我刚刚发布了一个用于 jQuery 的 CKEditor 插件，它将在后台处理所有这些，无需任何额外代码： http ://www.fyneworks.com/jquery/CKEditor/

于 2009-11-25T20:23:26.573 回答
6

我今天也一直在尝试解决这个问题。我意识到上面的代码对我不起作用的原因是因为在引用文档属性时 CKEditor 实例还没有准备好。因此，您必须调用“instanceReady”事件，并且可以在其中使用文档的事件，因为在此之前它不存在。

这个例子可能对你有用：

CKEDITOR.instances["editor1"].on("instanceReady", function()
{
//set keyup event
this.document.on("keyup", CK_jQ);

 //and paste event
this.document.on("paste", CK_jQ);
});

function CK_jQ()
{

    CKEDITOR.tools.setTimeout( function()
    { 
        $("#editor1").val(CKEDITOR.instances.editor1.getData()); 
    }, 0);
}
于 2009-09-24T16:17:07.563 回答
3

这个应该做...

CKEDITOR.instances["editor1"].document.on('keydown', function(event)
{
    CKEDITOR.tools.setTimeout( function()
    { 
        $("#editor1").val(CKEDITOR.instances.editor1.getData()); 
    }, 0);
});

CKEDITOR.instances["editor1"].document.on('paste', function(event)
{
    CKEDITOR.tools.setTimeout( function()
    { 
        $("#editor1").val(CKEDITOR.instances.editor1.getData()); 
    }, 0);
});

编辑：添加部分以在粘贴后更新文本框......

于 2009-05-29T04:25:08.767 回答
2

我在这方面取得了成功：

console.log(CKEDITOR.instances.editor1.getData());
于 2010-03-13T03:27:12.613 回答
1

这样做不是更好吗：

CKEDITOR.instances.editor1.on('contentDom', function() {
          CKEDITOR.instances.editor1.document.on('keyup', function(event) {/*your instructions*/});
        });

参考：http ://cksource.com/forums/viewtopic.php?f=11&t=18286

于 2010-04-13T01:33:25.483 回答
1

我采取了一种稍微不同的方法，我认为使用 ckeditor 的更新功能会更好，并且由于使用了 keyup，因此不需要超时

CKEDITOR.instances["editor1"].on("instanceReady", function()
{
//set keyup event
this.document.on("keyup", CK_jQ);

 //and paste event
this.document.on("paste", CK_jQ);
}

function CK_jQ()
{
   CKEDITOR.instances.editor1.updateElement(); 
}
于 2009-12-18T17:36:09.007 回答
1

CKEDITOR.instances.wc_content1.getData()将返回 ckeditor 数据
CKEDITOR.instances.wc_content1.setData()将设置 ckeditor 数据

于 2011-07-22T20:08:09.573 回答
1

contentDom 事件对我有用，而不是 instanceReady ......我真的很想知道这些事件是什么，但我认为它们是专有的......

var editor = CKEDITOR.replace('editor');

CKEDITOR.instances.editor.on("instanceReady", function(){
    this.on('contentDom', function() {
        this.document.on('keydown', function(event) {
            CKEDITOR.tools.setTimeout( function(){ 
                $(".seldiv").html(CKEDITOR.instances.editor.getData()); 
            }, 1);
        });
    });
    this.on('contentDom', function() {
        this.document.on('paste', function(event) {
            CKEDITOR.tools.setTimeout( function(){ 
                $(".seldiv").html(CKEDITOR.instances.editor.getData()); 
            }, 1);
        });
    });
    edits_clix();
    var td = setTimeout("ebuttons()", 1);
})
于 2011-02-17T10:34:46.860 回答
0

我用当前版本解决了这个问题：http: //ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js

在第 55 行之后 this.submit( function( event ) { - 我添加了以下代码：

if (typeof CKEDITOR !== "undefined") {
    for ( instance in CKEDITOR.instances )
        CKEDITOR.instances[instance].updateElement();
}
于 2012-01-17T12:45:45.067 回答
0

我认为用户在询问序列化，我正在努力序列化要提交的表单，这给了我很多问题。

这对我有用：

$(document).ready(function() {
$('#form').submit(function(){
if ( CKEDITOR.instances.editor1.getData() == '' ){
    alert( 'There is no data available' );//an alert just to check if its working
}else{
    var editor_data = CKEDITOR.instances.editor1.getData();
    $("#editor1").val(editor_data); //at this point i give the value to the textarea
    $.ajax({ 
                    //do your ajax here  

                     });

        }
return false;
    });
 });
于 2011-11-09T16:14:56.483 回答