`
jiangzhenghua
  • 浏览: 602860 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

CKEditor 中getData()和setData()中的问题

阅读更多

今天写了一段代码:目的是向CKEditor中插入数据如下:

function insertSrc(srcArray){
			var i=0
			for (i=0;i<=srcArray.length;i++)
			{
				var oEditor = CKEDITOR.instances.articleContent;
                var editorData_old = oEditor.getData() ;
                var editorData_new = editorData_old.substring(0,editorData_old.indexOf('</head>'))
                + 
                srcArray[i]
                +  editorData_old.substring(editorData_old.indexOf('</head>')) ;
                oEditor.setData(editorData_new) ;
			}             
		}

 

经过调试发现该函数执行有问题,循环中后几个循环不能执行。原因就是CKEDITOR中的setData()方法是ajax异步的。

最终改写代码为:

function insertSrc(srcArray){
			var oEditor = CKEDITOR.instances.articleContent;
            var editorData_old = oEditor.getData() ;
			var old_begin = editorData_old.substring(0,editorData_old.indexOf('</head>')) ;
			var old_end =  editorData_old.substring(editorData_old.indexOf('</head>')) ;
			var insertData = '' ;
			for(var i=0;i<srcArray.length;i++)
			{
               	insertData = insertData + srcArray[i] ;
			}
			var editorData_new =old_begin + insertData + old_end ;
			oEditor.setData(editorData_new) ;
		}

 

注:我们应该知道CKEditor中getData()方法是正常的方法,而setData()方法是异步方法。

分享到:
评论

相关推荐

    ckeditor的demo代码

    var editorContent = CKEDITOR.instances.editor1.getData(); ``` 而设置内容则使用`setData()`方法: ```javascript CKEDITOR.instances.editor1.setData('新的编辑器内容'); ``` 此外,CKEditor还支持插件扩展...

    Ext中CKEditor应用事例

    你也可以通过CKEditor的API获取或设置编辑器的内容,如`CKEDITOR.instances['myEditor'].getData()`用于获取编辑器的当前内容,`CKEDITOR.instances['myEditor'].setData(html)`则用于设置编辑器的内容。 总的来说...

    ckeditor实例

    CKEditor编辑的内容是存储在内存中的,当需要保存或加载数据时,可以使用`getData()`和`setData()`方法。例如,当用户提交表单时,可以获取编辑器中的内容: ```javascript var editorContent = CKEDITOR.instances....

    ckeditor及配置方法

    - `editor.getData()`:获取编辑器中的内容。 - `editor.setData(text)`:设置编辑器的内容。 - `editor.insertText(text)`:在光标位置插入文本。 - `editor.execCommand(commandName)`:执行指定的命令,如`'bold'...

    ckeditor_api

    - **获取和设置内容**:`CKEDITOR.instances.editor1.getData()`和`CKEDITOR.instances.editor1.setData()`分别用于获取和设置编辑器的HTML内容。 - **插件系统**:CKEditor支持自定义插件,开发者可以通过编写...

    Angular2CKEditor组件

    此外,还可以通过组件的方法与CKEditor进行交互,如`getData()`获取当前编辑器的内容,`setData(content)`设置编辑器内容。 ### 五、示例代码 ```typescript import { Component } from '@angular/core'; @...

    ckeditor的使用

    当用户在编辑器中输入内容后,可以通过`getData()`方法获取HTML格式的文本,然后保存到服务器。反之,可以使用`setData()`方法将服务器端的内容填充到编辑器中。 总结起来,CKEditor是一个强大的网页富文本编辑器,...

    ckeditor的用法以及DLL

    var content = CKEDITOR.instances.myEditor.getData(); ``` 而设置内容: ```javascript CKEDITOR.instances.myEditor.setData('&lt;p&gt;Hello, World!&lt;/p&gt;'); ``` 6. **上传图片**:CKEditor内置了图片上传功能...

    ckeditor文本编辑器

    4. **获取和设置内容**:`CKEDITOR.instances.editor1.getData()`用于获取编辑器中的内容,`CKEDITOR.instances.editor1.setData(content)`则用于设置内容。 5. **保存与加载内容**:编辑器内容可以通过Ajax等方式...

    html富文本编辑器ckeditor最新版

    6. **数据交互**:CKEditor提供了获取和设置编辑器内容的方法,如`getData()`和`setData()`,方便与服务器进行数据交换。 关于注意事项,有几点需要注意: 1. **兼容性**:虽然CKEditor支持大多数现代浏览器,但在...

    ckeditor富文本

    6. **数据交互**:获取或设置编辑器内容使用`getData()`和`setData()`方法。例如,当用户提交表单时,你可能需要获取编辑器中的内容: ```javascript var editorContent = CKEDITOR.instances['textarea_id'].get...

    ckeditor源码

    6. 数据交互:可以通过CKEditor的API获取或设置编辑器的内容,如`CKEDITOR.instances.myTextarea.getData()`和`CKEDITOR.instances.myTextarea.setData(text)`。 总之,CKEditor的源码提供了丰富的功能和高度的定制...

    CKEditor Helloworld

    CKEditor还提供API,用于获取或设置编辑器的内容,如`CKEDITOR.instances.editor1.getData()`用于获取编辑器的当前内容,`CKEDITOR.instances.editor1.setData(text)`用于设置新的内容。这些API在处理用户输入或保存...

    ckditor在jsp中的使用

    要获取或设置CKEditor的内容,可以使用`getData()`和`setData()`方法: ```javascript var content = CKEDITOR.instances.myEditor.getData(); // 获取内容 CKEDITOR.instances.myEditor.setData('新的内容'); /...

    CKEditor_poc:CKEditor API概念验证

    console.log('Content changed:', editor.getData()); }); ``` **6. 编辑器的生命周期** CKEditor有明确的生命周期,包括初始化、加载、就绪、销毁等阶段。你可以利用这些阶段进行自定义操作,比如在编辑器就绪时...

    CKEditor/FCKEditor 使用 CKeditor 3.0.1 快速使用教程(含插入图片)

    要设置编辑器的内容,可以使用`setData`方法,而获取编辑器的内容则可以通过`getData`方法。这些方法分别对应于设置和获取编辑器的值,它们可以接受一个字符串作为参数,或者返回当前编辑器中的HTML内容。 在...

    WinForms-CKEditorControl:CKEditor Control for Windows Forms应用程序的示例用法

    return CKEDITOR.instances.editor.getData(); } function setContent(content) { CKEDITOR.instances.editor.setData(content); } 这些功能稍后将用于从CKEditor面板中注入和检索html。 用法 : var curDir = ...

    ckEditorC#.rar

    你可以通过 `CKEDITOR.instances.editor1.getData()` 获取编辑器内容,`CKEDITOR.instances.editor1.setData()` 设置内容。在 C# 中,通常需要在服务器端通过 JavaScript 将内容写入隐藏字段,然后在提交表单时读取...

    实用的文本编辑插件及用法

    3. **获取和提交编辑内容**:通过调用CKEditor的`getData()`方法,我们可以获取到用户编辑的内容,然后通过AJAX或者表单提交到服务器端。 4. **服务器端处理**:在JSP页面的后台(通常是Java类),接收到数据后,...

    JQuery获取或设置ckeditor的数据(示例代码)

    要获取CKEditor当前编辑的文本,你可以使用`CKEDITOR.instances`对象,然后调用其`getData()`方法。这个方法会返回编辑器中显示的所有HTML内容。例如,如果你的CKEditor实例ID为`txt_editor_tc`,获取数据的代码...

Global site tag (gtag.js) - Google Analytics