现在的位置: 首页 > 综合 > 正文

Ckeditor事件绑定 .

2013年11月22日 ⁄ 综合 ⁄ 共 1595字 ⁄ 字号 评论关闭

这段时间使用js+cookies进行自动草稿保存,个人觉的,这些全在客户端处理比较的好,所以没有使用AJAX+数据库的自动草稿保存方法。

结果出现Ckeditor无法绑定onkeyup,onselect,onclick事件的问题,查看了Ckeditor的API,发现如下说明:

  1. instanceReady.ckeditor: fired when the editor is created, but before any callback being passed to the ckeditor() method.   
  2. setData.ckeditor: fired when data is set into the editor.   
  3. getData.ckeditor: fired when data is fetched from the editor. The current editor data is also passed in the arguments.   
  4. destroy.ckeditor: fired when the editor gets destroyed. It can be used, for example, to execute some cleanup on the page.   


估计是使用instanceReady,然后在网上查找了一翻,要找这东西的事件绑定,真难。找了N久,找到一个Ckeditor二次开发的例子,经过修改,终于成功。下面是绑定方法。

首先是文本编辑器的绑定:

  1. <textarea name="Content" rows="10" cols="20" id="Content"></textarea>  
  2.   <script type="text/javascript">  
  3.   var editor = CKEDITOR.replace('Content', {  
  4.   language: 'zh-cn', //简体中文    
  5.   width: 739,  
  6.   height: 125,  
  7.   toolbar: 'DJArticle'//工具栏的名称  
  8.   });    
  9.   </script>  


这样,编辑器就出现了。然后是绑定onkeyup,onselect,onclick事件。

  1. <script type="text/javascript">  
  2.   
  3.     CKEDITOR.instances["Content"].on("instanceReady", function () {  
  4.         //set keyup event  
  5.         this.document.on("keyup", AutoSave);  
  6.         //and click event  
  7.         this.document.on("click", AutoSave);  
  8.         //and select event  
  9.         this.document.on("select", AutoSave);  
  10.     });  
  11.   
  12.   
  13.     function AutoSave() {//相应的操作过程,可以按下面写,也可以按一般javascript过程写。  
  14.         CKEDITOR.tools.setTimeout(function () {  
  15.             alert("10101010");  
  16.         }, 0);  
  17.     }     
  18.   
  19.             </script>  


至此,绑定完成!

【上篇】
【下篇】

抱歉!评论已关闭.