Ckeditor 首行缩进

//初始化编辑器 

var ckeditor = CKEDITOR.replace(domName,{
   height: 500,
   width:800
});
 

//监听粘贴代码时,进行首行缩进,因为粘贴后,编辑器还需要处理内容才会渲染,所以需要加入延时执行。

技术要点:

  1. ckeditor编辑器会默认过滤“text-indent”的样式。
  2. 不能关闭ckeditor过滤功能,会增加很多垃圾代码。
  3. 即使关闭过滤机制,可以通过 (item).style.textIndent='2em',设置缩进,对不需要缩进的段落取消缩进的时候也无法实现,因为ckeditor没有对应的工具设置。
  4. 粘贴后,不能直接进行document处理,需要加入延时
  5. 需要判断那些标签需要加入缩进,连图片一起粘贴的代码里面,img标签会在p标签里面换行。效果是这样的:“

    ”,其他情况暂时未知,还需要根据实际情况定义。
ckeditor.on("instanceReady", function () {

	//监听粘贴事件
	this.document.on("paste", function(e) {

		setTimeout(function(){
			var p = ckeditor.document.find("p");
			count = p.count();
			for(var i = 0; i < count; i++) {
				var item = p.getItem(i).$;

				//判断是否有子元素,用于判断是否p标签里面有图片的情况,具体要根据实际情况进行判断
				if(item.children.length<1){
					var html = item.innerHTML;
					if(html){
						//因为text-indent会被编辑器默认过滤掉,所以需要使用全角字符“ ”代替缩进,这个空白字符代表一个中文字符长度,非空白键。
						html = html.replace(/ /g,''); //过滤部分网站已经存在的缩进符号,如新浪新闻就是使用全角空白符代替缩进的。
						item.innerHTML = '  '+html; //从新设置内容
					}
				}
			}
		},500);

	});
});

 

你可能感兴趣的:(Ckeditor 首行缩进)