您的位置:首页 > 产品设计 > UI/UE

EasyUI使用百度编辑器,第一次打开没有问题,但是第二次打开不显示。

2014-06-07 08:09 351 查看
使用EasyUI做一个项目,用百度编辑器出现问题,第一次刷新能用,再打开不能用,刷新整个页面还可以用一次,最终找到问题在哪。

我用的默认百度编辑器默认Demo,将下面的JS放入Body体里。

<script type="text/javascript">
//实例化编辑器
//建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
var ue = UE.getEditor('editor');
</script>
<td>内容</td>
<td><script id="editor" type="text/plain" style="width:80%;height:30%;" name="content"></script></td>
这是我的Dialog,不过是拓展后的modalDialog,官方文档没有。


function addFun() {
parent.$.modalDialog({
title : '增加资讯',
width : 950,
height : 600,
modal : true,
href : '${pageContext.request.contextPath}/client_news/add.jsp',
buttons : [ {
text : '增加',
handler : function() {
parent.$.modalDialog.openner_dataGrid = dataGrid;
var f = parent.$.modalDialog.handler.find('#newsAdd');
</span>f.submit();
}
} ]
});
}
拓展modalDialog代码(别人写的拓展)
$.modalDialog = function(options) {
if ($.modalDialog.handler == undefined) {// 避免重复弹出
var opts = $.extend({
title : '',
width : 840,
height : 680,
modal : true,
onClose : function() {
$.modalDialog.handler = undefined;
$(this).dialog('destroy');
//添加百度编辑器销毁代码

},
onOpen : function() {
parent.$.messager.progress({
title : '提示',
text : '数据处理中,请稍后....'
});
}
}, options);
opts.modal = true;// 强制此dialog为模式化,无视传递过来的modal参数
return $.modalDialog.handler = $('<div/>').dialog(opts);
}
};
经过分析是因为使用百度编辑器没有销毁的原因,所以在>modalDialog关闭的时候将,百度编辑器销毁,下面是销毁代码。
if (typeof ue != 'undefined') {
ue.destroy();
}


有可能你添加完了,问题仍然出现,你还需要找一下原因。问题可能是因为你先引入了easyui,按照我的这种写法应该先引入百度编辑器插件,再引入easyui,不然typeof ue != 'undefined'就不行啦,找不到。


<!-- 引入百度编辑器插件 -->
<script type="text/javascript" charset="utf-8"
src="${pageContext.request.contextPath}/jslib/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8"
src="${pageContext.request.contextPath}/jslib/ueditor/ueditor.all.min.js"></script>
<!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
<script type="text/javascript" charset="utf-8"
src="${pageContext.request.contextPath}/jslib/ueditor/lang/zh-cn/zh-cn.js"></script>
<!-- 引入EasyUI -->
<link id="easyuiTheme" rel="stylesheet"
href="${pageContext.request.contextPath}/jslib/jquery-easyui-1.3.3/themes/<c:out value="${cookie.easyuiThemeName.value}" default="bootstrap"/>/easyui.css"
type="text/css">
<!-- <link rel="stylesheet" href="${pageContext.request.contextPath}/jslib/jquery-easyui-1.3.3/themes/icon.css" type="text/css"> -->
<script type="text/javascript"
src="${pageContext.request.contextPath}/jslib/jquery-easyui-1.3.3/jquery.easyui.min.js"
charset="utf-8"></script>
<script type="text/javascript"
src="${pageContext.request.contextPath}/jslib/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"
charset="utf-8"></script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐