如何在同一个页面加载两个或多个百度的 UEditor HTML 编辑器
出现的问题:在同一个页面中,创建了两个以上百度的 UEditor 编辑器,但是只有一个起作用了,在向第二个中插入内容时,总插入到第一个中去了。
解决方法:
editorcontent = new baidueditoruiEditor();//只对第一个起作用
// editorcontentrender('content');
// editorcontentrender('content1');
// editorcontentrender('content2');
//所有的都起作用
UEgetEditor("content");
UEgetEditor("content1");
UEgetEditor("content2");
百度的Ueditor编辑器出于安全性考虑,用户在html模式下粘贴进去的html文档会自动被去除样式和转义。虽然安全的,但是非常不方便。
做一下修改把这个功能去掉。
一、打开ueditoralljs
二、大概9300行找到 ///plugin 编辑器默认的过滤转换机制,把下面的
'allowDivTransToP':true
值改成false。为true的时候会自动把div转成p。
三、大概9429行,有个case 'li',这个是把li里面的样式去掉,把这个case注释掉。
四、大概14058行,下面的第一个utilseach功能注释掉,这个是自动给li里面的内容增加一个p。
五、大概14220行,
nodeclassName = utilstrim(nodeclassNamereplace(/list-paddingleft-\w+/,'')) + ' list-paddingleft-' + type;
注释掉,这个是自动给ul增加一个内置的样式。
下面的14222行
listylecssText && (listylecssText = '');
注释掉,这个是自动去除粘贴进去的代码的li的style样式
至此,我们粘贴进去的html格式的ul和li就不会被转义了。
这个富文本编辑器实例化时候你传递的id不一样就可以了。
如题,一个页面上使用两个百度编辑器ueditor
能够保证 提交时两个数据不冲突,各管各的,初始化时后一个不会对前一个产生影响。
<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/ueditorconfigjsv={:SITE_VERSION}"></script>
<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/ueditoralljsv={:SITE_VERSION}"></script>
<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor/lang/zh-cn/zh-cnjsv={:SITE_VERSION}"></script>
<script type="text/javascript">
$('textarea[name="{$addons_dataname}"]')attr('id', 'editor_id_{$addons_dataname}'); windowUEDITOR_HOME_URL = "__STATIC__/ueditor/"; windowUEDITOR_CONFIGinitialFrameHeight = parseInt('{$addons_configeditor_height}'); windowUEDITOR_CONFIGscaleEnabled = <eq name="addons_configeditor_resize_type" value="1">true<else />false</eq>; windowUEDITOR_CONFIGimageUrl = '{:addons_url("EditorForAdmin://Upload/ue_upimg")}'; windowUEDITOR_CONFIGimagePath = ''; windowUEDITOR_CONFIGimageFieldName = 'imgFile'; //在这里扫描
windowUEDITOR_CONFIGimageManagerUrl='{:addons_url("EditorForAdmin://Upload/ue_mgimg")}';//在线管理的处理地址
windowUEDITOR_CONFIGimageManagerPath='';
var imageEditor{$addons_dataid} = UEgetEditor('editor_id_{$addons_dataname}'); //添加一下判断是否是单个按钮管理 需要执行一下代码
<if condition="isset($addons_data['btnClassName'])" >
imageEditor{$addons_dataid}ready(function () { //设置编辑器不可用
imageEditor{$addons_dataid}setDisabled(); //隐藏编辑器,因为不会用到这个编辑器实例,所以要隐藏
imageEditor{$addons_dataid}hide(); //侦听上传
imageEditor{$addons_dataid}addListener('beforeInsertImage', function (t, arg) { //将地址赋值给相应的input,只去第一张的路径
//consolelog(t);
//consolelog(arg);
<if condition="empty($addons_data['is_mult'])" > //单张情况
$("{$addons_dataname}_preview")html(""); var imghtml = $("<img src="+arg[0]src+" width='100' height='100'/>");
$("{$addons_dataname}_preview")append(imghtml); //储存路劲
//单张存储id
$("#editor_id_{$addons_dataname}")text(arg[0]id); //预览
$("{$addons_dataname}_preview")show(); //微信预览
$('weixin-cover-pic')attr('src',arg[0]src); //consolelog(arg);
<else /> //多张情况
var srcs = ""; var srcIds = ""; //$("{$addons_dataname}_preview")html("");
for(var i=0;i<arglength;i++){ if(i==arglength-1){
srcs = srcs + arg[i]src;
srcIds = arg[i]id;
}else{
srcs = srcs + arg[i]src+"|";
srcIds = srcIds + arg[i]id+",";
} var imghtml = $("<img src="+arg[i]src+" width='100' height='100'/>");
$("{$addons_dataname}_preview")append(imghtml); //consolelog(arg[i]src);
}
$("{$addons_dataname}_preview")append(imghtml);
$("{$addons_dataname}_preview")show(); var oldIds = $("#editor_id_{$addons_dataname}")text(); //多张存储一逗号分隔的id串
$("#editor_id_{$addons_dataname}")text(oldIds+","+srcIds); </if>
}) //增加按钮className
$('{$addons_databtnClassName}')bind('click',function(){ var uploadImage = imageEditor{$addons_dataid}getDialog("insertimage");
uploadImageopen();
})
});
这是源代码了,请问各位,应该如何该
百度UEditor编辑器官方并没有出WordPress的插件,但是网上的大神们还是做出来了。
百度搜索“成航先森”进入博客,在博客右上角搜索“百度UEditor编辑器”就有百度UEditor编辑器1431版本的下载,以及如何自己将最新版本的1433版本集成到WordPress。
首页的轮播图中也有下载链接。
加油。
百度编辑器支持一键排版。
请登录百度编辑器官网的API栏目查看。http://ueditorbaiducom/doc/#COMMAND::autotypeset
0条评论