如何以编程方式查询CKEDITOR内容？

看着http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#getData后，我已经到位editor1在尝试了一些变化：如何以编程方式查询CKEDITOR内容？

var editor_contents = CKEDITOR.instances.editor1.getData();

Chrome的控制台报告说，它无法读取的未定义的属性的getData。我试过了引用的那一行，以及editor0和scratchpad（后者是TEXTAREA的HTML ID，我给CKEDITOR）。他们都得到相同的错误。

我该如何（或应该）调用getData（）来获取TEXTAREA的HTML ID'scratchpad'的内容？我试着查询jQuery（'＃scratchpad'），但是我得到的返回值是用来初始化#scratchpad的值，并且没有显示后续编辑。

我很想知道如何以编程方式查询CKEDITOR小部件的实时内容。

谢谢，

- 编辑 -

我试图检查元件，并且基于该尝试了以下：

变种editor_contents = jQuery的（'TD＃cke_contents_scratchpad IFRAME body.cke_show_borders “）的.html（）;

有一个未定义的值。我的猜测是，Chrome的检查员以方便的方式呈现iframe，但不是以jQuery的方式呈现。（那是猜测关闭基地？）

来源

2014-01-15 JonathanHayward

听起来像是你不是错误的ID叫，或者如果你想使用jQuery的，你有没有更新textarea元素。

要解决“我从得到的返回值是用来填充最初的#scratchpad价值，并没有表现出后续的编辑”需要调用updateElement()。看到这个答案获取值之前如何做到这一点的更多细节：https://stackoverflow.com/a/9924844/694325

但我也会检查，如果你确实设置了正确的id和你的元素是editor1。如果我们看到您的HTML和您用来替换编辑器的JavaScript，这将有所帮助。

来源

2014-01-16 13:54:59 Nenotlep

尝试

<script> 
$(document).ready(function(e) { 
    var config = { 
     extraPlugins: 'htmlwriter', 
     height: 100, 
     width: '100%', 
     toolbar: [ 
      ['Source', '-', 'Bold', 'Italic', 'Underline', '-', ], 
      ['TextColor', '|', 'Maximize', 'Preview'], 
     ] 
    }; 
    CKEDITOR.replace("mytextareaname", config); 

    $("#mybutton").click(function(){ 
     var editor_contents = CKEDITOR.instances["mytextareaname"].getData(); 
     alert(editor_contents); 

    }) 
}); 
</script> 
</head> 
<body> 
<textarea id="mytextareaname" name="mytextareaname"></textarea> 
<input type="button" value="Testar Editor" id="mybutton" />

来源

2014-01-15 16:38:18

Hrm？这两个在JavaScript中是等价的，并且它们适当地给出相同的错误。 – JonathanHayward

我知道它是相同的。我也无法使用它。我会发送代码。 –

它可能对你有用。 –

如果您正在执行上的document.ready或在window.onload中的getData（）函数，你必须在你的编辑器没有当前的内容，那么当然它会返回undefined。

将您的getData（）调用放入一个函数中，一旦您将某些内容输入到文本编辑器中，就可以调用该函数。下面是它可能是什么样子：

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Editor</title> 
    <script src="ckeditor/ckeditor.js"></script> 
</head> 
<body> 
    <textarea name="editor1" id="editor1" cols="30" rows="10"></textarea> 
    <!-- Button that triggers below function--> 
    <button onclick="logEditorData()">Log the Content!</button> 
    <script> 
     // instantiate the editor 
     CKEDITOR.replace('editor1'); 

     // declare function that you'll call with above button 
     // once you've type some words into the editor 
     function logEditorData() { 
      var editorData = CKEDITOR.instances.editor1.getData(); 
      console.log(editorData); 
     }; 

    </script> 
</body> 
</html>

来源

2014-01-15 22:36:53 keepitreal

如何以编程方式查询CKEDITOR内容？

回答

相关问题