论坛首页 Web前端技术论坛

Uedit使用记录

浏览 3603 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2014-07-01  

       最近项目中频繁使用到 uedit,在使用中遇到一些磕磕绊绊的事。记录一下

       1、渲染问题

       ueidt自带的渲染方法为editor.render(id),但这个方法只能调用一次。当页面中存在多个多个需要渲染的DOM节点时,这个方法就爱莫 能助了。在API里翻腾了许久后,尝试使用UE.getEditor(id)这个方法。该方法存在偶发性报错问题(并不严重的错误,而且未能确定是由该方 法引起的);代码如下:

for(var i = 0;i<plan_content.length;i++){
	pc_only = $(plan_content[i]);
	UEditArray[i] = UE.getEditor(pc_only.attr('id'));			
}

    那个偶发性错误如果在以后的使用中找到处理方法,会及时更新。这个问题不会影响功能。

    2、内容问题

     在 使用中需要对uedit中的内容进行为空验证,经测试在Uedit中编辑的内容会在失焦时将值存入原textarea的val属性中。官网提供 有.getContent()方法来提供手动获取数据。我现在采用的方法是当鼠标移出uedi区域后就调用该方法,毕竟嘛,你总不至于把提交按钮放到 uedit上面吧。单片代码看起来可能有点晕,我粘个完整点的代码,和上面的渲染重复了。

/*
		@UeditInit:初始化页面中的UEdit插件
		并循环当前uedit容器,为其分类提供鼠标移出事件;
	*/
	UEditInit: function(){
		var plan_content = $('.plan_content');
		try{
			var editor = new UE.ui.Editor();				
			if(plan_content && plan_content.length> 0){
				var pc_only;
				for(var i = 0;i<plan_content.length;i++){
					pc_only = $(plan_content[i]);
					pc_only.attr('pc_Index',i); //为鼠标移出事件,提供索引
					pc_only.parents('.form_element').addClass('UEditArea');  //为提供鼠标移出事件,提供元素标识
					UEditArray[i] = UE.getEditor(pc_only.attr('id'));
					//editor.render($(plan_content[i]).attr('id'));  使用UEdit官网上的部署编辑器方法替换render【渲染编辑器的DOM到指定容器】
					
					}
				/**
					为当前全部uedit容器提供鼠标移出事件;
					事件发生时,将uedit内容放至对应的textarea中
				*/
				}			
				var UEditArea = $('.UEditArea');//获取当前所有使用uedit编辑器的父容器	,所用class是在初始化ueidt时通过循环加上去的
				UEditArea.mouseleave(function(){
					var _this = $(this);
					var tmp_textarea = 	_this.find('textarea');
					var pc_Index = Number(tmp_textarea.attr('pc_Index'));
					tmp_textarea.val(UEditArray[pc_Index].getContent());
					});
					
			}catch(e){
				console.log('%cUEditInit出现异常,异常为:'+e,'color:#f00');
			}finally{
									
					}	
		},

       其它的API上都有介绍,使用起来按API上面走就可以了。希望上面写的对各位有所帮助,有一同使用这个插件的有问题可以留言交流。

 

   发表时间:2014-07-04  
getEditor原则上是不会报错的,但是初始化时需要时间的 ,一般在jsp加载完毕之后才初始化 否则会报错
另外你说的为空校验,ueditor不是提供了长度限制吗,在config中可以配置也有现成的方法可以取得富文本的text,html和length
0 请登录后投票
   发表时间:2014-07-07  
zhangguowei 写道
getEditor原则上是不会报错的,但是初始化时需要时间的 ,一般在jsp加载完毕之后才初始化 否则会报错
另外你说的为空校验,ueditor不是提供了长度限制吗,在config中可以配置也有现成的方法可以取得富文本的text,html和length

可能是我写的有点模糊,你没有理解到我的意思。getEditor这个主要是为了解决页面中存在多个uedit的情况。
至于空校验,是指uedit将编辑器内容返回原textarea时,需要一个缓冲时间。所以进行预先操作,对uedit中的值在触发提交之前,手动将值存入textarea中。
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics