Question

我有以下代码在http://www.wilsea.com/iframe显示CKEditor。我可以在html文档中获取和设置数据。

<!DOCTYPE html>
<html>
 <head>

   <script type="text/javaScript" 
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
   </script>
   <script src="http://www.wilsea.com/ckeditor/ckeditor.js"></script>

 </head>
 <body>
        <textarea id="editor1" name="editor1" rows="10" cols="80">
            This is my textarea to be replaced with CKEditor2
        </textarea>
   <div id="someID">Hello world!</div>
   <script>
           function myFunction() {
           var html = 'this is my new text from function1 ';
           alert('function 1 test121');
           CKEDITOR.instances['editor1'].setData(html);
           }

           function myFunction2() {
           var editorData = CKEDITOR.instances['editor1'].getData();
           alert('new data' + editorData);
           }
           CKEDITOR.replace( 'editor1' );
   </script>
   <p>Click the button to trigger a function.</p>
   <button onclick="myFunction()">Set Data</button>
   <button onclick="myFunction2()">Get Data</button>
   <p id="demo"></p>
 </body>
</html>

我在这里听到了这个答案：http://simple.procoding.net/2008/03/21/how-to-access-iframe-in-jquery/

所以我补充道：

<div id="someID">Hello world!</div>.

我已将该应用上传至www.wilsea.com/iframe，因此不存在跨域问题。

按钮代码为：

var HTML1 =  $('#iFrame1').contents().find('#someID').html();
alert(HTML1);


var HTML1 =  $('#iFrame1').contents().find('#editor1').html();
alert(HTML1);

我在Chrome中使用了开发人员工具，我看到'id someID'退出了，所以我在这里不明白这部分是什么？

我的目标是能够：

从我的数据库中填充CKEditor的html内容。
允许客户编辑/添加图像等。
将CKEditor的html内容保存到我的数据库中。

Answer 1

我从这里得到了答案：

https://getsatisfaction.com/application_craft/topics/accessing_an_iframe?utm_source=notification&utm_medium=email&utm_campaign=new_reply&utm_content=reply_button&reply[id]=14399739#reply_14399739

关键是DOM元素id不是AC小部件名称。但是您可以使用以下内容轻松获取和使用DOM ID（'contextMenu'是此示例中iFrame小部件的AC名称）

contextMenuId = 'iframe_' + app.w('contextMenu').base()[0].id; 

document.getElementById(contextMenuId).contentDocument.getElementsByClassName('cke_wysiwyg_frame')[0].contentDocument.body.innerHTML

它可能与每个人无关，因为它特定于应用程序工艺，但思考过程可能会帮助其他人。

MRWarby

在iframe中获取CKEditor的内容

1 个答案: