在新的一个项目中,在用户的要求下使用了飞鱼富文本编辑器,用户提出编辑器默认字体太小,要调整字体大小和清除word格式字符串后的默认大小。
和tiny_mce编辑器比起来,飞鱼编辑器在这方面的可配置方式提供的支持太少,而且关于这方面的资料几乎没有,好在飞鱼编辑器虽然可配置东西不到,但还算比较简单,直接看源码和文件,找到了修改的地方:
在css/CoolBlue/EditorArea.css文件里,代码很简单,修改一下,加入字体设置代码就可以了:
body,a,table,div,span,td,th,input,select{font-size:9pt;font-family:"宋体,Verdana,Arial";Color:#000000;}
body {background-color:#FFFFFF;SCROLLBAR-BASE-COLOR:#9EBEF5,font-size:13pt}
font-size:13pt 就是加入的设置。
至于在清除word格式后,设置清除样式后的内容默认字体大小,就有点麻烦了,找了半天,没有样式的设置,直接进入js文件查找,用一个比较笨拙的办法实现了:
include/editor.js文件里。有这样的代码:
-
// 粘贴时自动检测是否来源于Word格式 function onPaste() { if (config.AutoDetectPasteFromWord && BrowserInfo.IsIE55OrMore) { var sHTML = GetClipboardHTML() ; var re = /<\w[^>]* class="?MsoNormal"?/gi ; if ( re.test( sHTML ) ) { if ( confirm( "你要粘贴的内容好象是从Word中拷出来的,是否要先清除Word格式再粘贴?" ) ) { cleanAndPaste( sHTML ) ; return false ; } } } else return true ; } function cleanAndPaste( html ) { // Remove all SPAN tags html = html.replace(/<\/?SPAN[^>]*>/gi, "" ); // Remove Class attributes html = html.replace(/<(\w[^>]*) class=([^ |>]*)([^>]*)/gi, "<$1$3") ; // Remove Style attributes html = html.replace(/<(\w[^>]*) style="([^"]*)"([^>]*)/gi, "<$1$3") ; // Remove Lang attributes html = html.replace(/<(\w[^>]*) lang=([^ |>]*)([^>]*)/gi, "<$1$3") ; // Remove XML elements and declarations html = html.replace(/<\\?\?xml[^>]*>/gi, "") ; // Remove Tags with XML namespace declarations: <o:p></o:p> html = html.replace(/<\/?\w+:[^>]*>/gi, "") ; // Replace the html = html.replace(/ /, " " ); // Transform <P> to <DIV> var re = new RegExp("(<P)([^>]*>.*?)(<\/P>)","gi") ; // Different because of a IE 5.0 error //html = html.replace( re, "<div$2</div>" ) ;
- html = html.replace( re, "<div style=\"font-size=14px\"$2</div>" ) ;
- insertHTML( html ) ; } // 在当前文档位置插入. function insertHTML(html) { if (!validateMode()) return; if (eWebEditor.document.selection.type.toLowerCase() != "none") eWebEditor.document.selection.clear() ; eWebEditor.document.selection.createRange().pasteHTML(html) ; }
这就是修改的代码。
修改的部分:
//html = html.replace( re, "<div$2</div>" ) ; html = html.replace( re, "<div style=\"font-size=14px\"$2</div>" ) ;
注释掉的就是原来的代码, 下一行就是增加的代码,这里就是在div中增加了样式修饰,没办法,没有配置文件,就只有直接修改源代码了。