最近开发过程中遇到一个artTemplate和uEditor方面的问题,解决了很久,记录下来以备参考:

问题和场景复原:
新闻列表有编辑按钮,点击编辑,进入新闻详情页面,新闻详情页面的内容从后台根据ID获取,然后通过artTemplate的模板渲染,新闻详情页面有一个字段是content,content字段使用的是uEditor编辑器。

问题就是因为详情页面是通过模板动态渲染的,我希望的结果是每次动态渲染完后再动态的append uEditor到我的模板中,然后将数据库的数据写到整个uEditor编辑器中,比如下面这样:

$(".edit-subject-script").append("<script id='edit_brief_content' type='text/plain'/>");

var u_edit = UE.getEditor('edit_brief_content');
    u_edit.ready(function() {
    u_edit.setContent(shop_item_obj.subject);
})


但是问题出现了,只有第一次点击详情的时候,这个编辑器会正常加载出来,之后就再也不出来了!!!

原因及解决问题的方法:
原因就是每次动态生成模板后动态添加的script标签 id是一样的,也就是说每次声明的模板都是一样的,这样,uEditor只会实例化一次,之后每次实例化都因为变量已经存在而不再实例化。

顺便补充一下,UE.getEditor()是实例化编辑器的语法。

知道问题以后那只需要我们保证动态模板渲染的时候这个uEditor是唯一的就好了,那我们就可以在实例化前销毁之前创建的同名的uEditor编辑器,ok ,想清楚问题的原因和解决方法,那我们可以开始愉快的写代码了,如下:

/*销毁uEditor实例防止其第二次加载时不起作用*/
function destoryUeditor(selector){
   UE.getEditor(selector,{
       toolbars:[]
   }).destroy();
   $("#"+selector).remove();
}

ok.问题完美的解决,每次编辑时uEditor都可以出来咯。

本文转载:CSDN博客