富文本编辑器tiny mce的事件处理

ljmst

在这里click事件是当我们将鼠标焦点定位在编辑器中，keyup事件是键盘弹起。关于具体的event对象响应，你可以使用console.log(event)在火狐浏览器的控制台中查看。

最近在做房产项目的时候，使用到了文本编辑器tiny mce，由于要做js的验证，所以就开始研究tiny mce，在度娘和谷歌搜索了半天，发现关于tiny mce的事件处理特别少，官方文档又是英文的api，所以我就把我的解决方法贴出来，供遇到相同问题的朋友参考，希望对你有所帮助。
提前说明一下，关于tiny mce编辑器的安装，我就不做过多介绍了，网上还是有不少这方面的资料的。
下面我们进入正题。
富文本编辑器tiny mce的事件处理
首先，我们需要在初始化编辑器的时候，指定事件处理的回调函数，代码如下：

tinyMCE.init({  
•     mode : "exact",  
      theme : "mytheme",  
•     language : "se",  
      elements : "elm1,elm2",  
•     handle_event_callback : 'eventHandle',  
• });
  

其中，handle_event_callback指定了事件处理的回调函数。被调用的函数eventHandle有一个参数，就是响应的事件。下面我们来看一下我在项目写的eventHandle函数。

function eventHandle(event)  
• {  
      if(event.type == 'click' || event.type == 'keyup'){  
•         var cur_html = tinyMCE.get('content').getContent();  
          if(!cur_html){  
•             tiny_mce_check.ShowWrong('#content', "请输入简介", "plus_c");  
              tiny_mce_check.isinfo = false;  
•             return false;  
          }  
•         tiny_mce_check.isinfo = 1;  
          tiny_mce_check.ShowWrong('#content', '', 'pw_success');  
•     }  
• }
  

从上面的函数可以看出，参数event是一个事件对象，我们根据事件对象的类型，即event.type来判断当前的事件。在这里click事件是当我们将鼠标焦点定位在编辑器中，keyup事件是键盘弹起。关于具体的event对象响应，你可以使用console.log(event)在火狐浏览器的控制台中查看。
结合tiny mce做前端js验证的关键就是编辑器内置的事件对象，找到了问题关键所在，就可以轻松搞定js验证的问题了！

小瑞子

支持一下楼主。哈哈，沙发。