事情是这样的,我在A页面的div通过 jQuery.load() 方法载入一个页面B时,B页面带有编辑框 textarea,现在想让这个 textarea 显示为一个 kindeditor的富文本编辑区域,但是怎么都不能成功,官网上的example根本就跑不起来。(也许是网络原因,或者其他)(官网example:http://kindeditor.net/ke4/examples/dynamic-load.html)
哎,心塞。
但是项目里已经有好几个地方都用这个编辑器,就不想换了(这些地方能跑成功的原因是页面直接调用kindeditor,而不是通过异步加载的方式)。
索性偶然瞥见其他编辑器也有出现这个问题,参考了别人的情况,终于成功实现了。
解决方法:不要在子页面B调用 KindEditor.create() ,而是在主页面A导入Editor的js包,在主页面的$.load() 的回调函数中创建编辑器。如果要使用编辑器的内容,则咋主页面设置全局变量 var editor; 将 KindEditor.create() 赋给 editor 就可以了,子页面B可以通过 editor.html() 来操作编辑器的内容。
代码:
主页面A.jsp
<script type="text/javascript" charset="utf-8" src="js/kindeditor-4.1.7/kindeditor-min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/kindeditor-4.1.7/lang/zh_CN.js"></script>
<div id="mainData" class="mainData">
<div id="dataContent"></div>
</div>
<script type="text/javascript">
var editor; //全局变量
$("#dataContent").load("B.jsp",function(){
editor = KindEditor.create('textarea[name=