游客
Ueditor编辑器使用异常情况汇总

我的项目是采用ajax异步加载页面的方式,所有请求的页面只包含主体代码以及页面专用的脚本,库文件都在主框架中一次加载完成。在使用Ueditor的时候就碰到了诡异的现象,首次加载编辑器一点问题都没有,得意的继续写代码。当测试的时候问题来了,当二次访问这个页面的时候,编辑器加载失败了,什么东西也没出来。慌!百度各种关键词终于找到一条类似问题,仔细阅读之后终于弄明白事情原委。因页面是异步加载,不会刷新,则百度编辑器的实例不会释放,首次打开,页面绚染的脚本都会执行一遍,故首次加载并无异常,当二次加载的时候,只是从编辑器中取出实例对像,并没有执行页面的绚染,故二次什么页面效果也没得。跟之前使用layui时的问题一样,第三方插件大部份的问题都如此,在异步的模式下,必须要在得到数据之后让其再次绚染方可正确显示插件固有的效果。知道问题的就下手去改。让异步加载页面的最后加上编辑器的绚染方法。代码如下。

<script type="text/javascript">
	$(document).ready(function(){
		UE.getEditor('editor').render('editor');//editor为编辑器容器的ID
	});
</script>

嗯,经测试二次加载时,页面正常!完美!然后事情并没有结束,当刷新页面首次访问的时候发现新问题了。编辑器出现了两个!

细想,这问题也不奇怪,完全出自已手嘛!为了解决二次绚染的问题加的代码在首次加载的时候一样会执行,而首次创建实例的时候就会绚染一次,再执行一次绚染的话,那不就出现两个了么!好,问题分析明白后就好解决了,根本问题就是编辑器的实例是否存在,如果存在就只要执行绚染即可,而如果不而在就执行创建而不再添加绚染的render方染就行了。而如果判断实例是否存在,暂未尝试,索性每次加载的时候先执行删除实例。然后再执行创建,这样可以确保每次都能创建唯一的实例,自然在创建的时候也会执行绚染了。到些问题解决!代码如下:

<script type="text/javascript">
	$(document).ready(function(){
		UE.delEditor('editor');
		var ue = UE.getEditor('editor');
	});
</script>

另有问题待解决 !等有了方案再做更新!、

现在是把编辑器的脚本放在主框架中加载,这样一来,不管访问哪个页面这个编辑器的脚本都会一直存在,而尝试将js文件放到编辑页面来异步加载出现大量路径异步的编辑器辅助文件,以及JQ的警告!