jquery keyup 对 CKEDITOR 中的数据进行操作答案

【问题标题】：jquery keyup on the data inside CKEDITORjquery keyup 对 CKEDITOR 中的数据进行操作
【发布时间】：2011-11-07 01:15:08
【问题描述】：

我正在构建一个小假 html/css 手机，它会自动从页面上的几个输入框中插入数据，如下所示：（手机是使用 iframe 插入的..（不要问）..）

$('#mgSiteDescription').bind('keyup', function() { 
   var iframedoc = $('.liveDemoFrame').get(0).contentDocument; 
   $(iframedoc).find('#header h2').html($(this).val()); 
});

这对我的输入字段非常有效。

现在，我将 CKEditor 用于我的文本区域，这让我遇到了问题。由于 textarea 没有在页面上实时更新，我的 keyup 事件不起作用，因此没有更新我的假手机。如何调整 CKEditor 以更新隐藏的文本区域？或者甚至可以访问 CKEditor 的 iframe 并提取数据？

谢谢。

【问题讨论】：

标签： jquery html textarea ckeditor

【解决方案1】：

更新：

我已经设法通过 CKEditor 获得了一个 keyup 功能，它甚至可以从我的假手机 iFrame 中删除内容。我只是不知道如何将 CKeditor 的值/数据插入到我的 iframe 中。如果这有意义吗？

    CKEDITOR.instances.mgAddHomePage.on('contentDom', function() {
        CKEDITOR.instances.mgAddHomePage.document.on('keyup', function(event) {

            var iframedoc = $('.liveDemoFrame').get(0).contentDocument; 
            $(iframedoc).find('#content').html($(this).val());      

        });
    });

我猜这是我需要更新的部分？

html($(this).val())

有什么想法吗？

编辑：

所以我让它的工作方式接近我的预期。这是与我处于相似位置的任何人的最终代码：

    CKEDITOR.instances.mgAddHomePage.on('contentDom', function() {
        CKEDITOR.instances.mgAddHomePage.document.on('keyup', function(event) {
            var iframedoc = $('.liveDemoFrame').get(0).contentDocument; 
            $(iframedoc).find('#content').html(CKEDITOR.instances.mgAddHomePage.getData());         
        });
    });

即使您不使用 iFrame，它仍然可以使用。只需破解 jquery iframe 的东西。

【讨论】：

更新 2：通过用 $(iframedoc).find('#content').html(CKEDITOR.instances.mgAddHomePage.getData()) 替换最后一位来修复它不过还有一个问题。它仅通过输入的数据发送。是否也无法通过样式/html 发送？
好的，样式确实出现了，但显然它们只在您键入时出现。进行更改后立即显示样式会很好，但现在就可以了。