zoukankan      html  css  js  c++  java
  • Ckeditor注册事件

    这段时间使用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.    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>  


    至此,绑定完成!

  • 相关阅读:
    Vue生命周期(转)
    Gulp的简单使用
    webpack的简单使用
    面试----手写正则表达式
    面试----你可以手写一个promise吗
    baidu.com跳转www.baidu.com
    php 操作时间、日期类函数
    php操作文件类的函数
    sphinx搜索 笔记
    bash下输入命令的几个常用快捷键
  • 原文地址:https://www.cnblogs.com/answercard/p/3710835.html
Copyright © 2011-2022 走看看