最近一个项目,用到了FCKeditor,客户说在FireFox下异常,检查了一下,果然有bug,添加功能正常,编辑功能异常。
很久没用FireFox了,而在Chrome和IE中一切正常,所以没有发现这个bug,真是惭愧,呵呵。
因为整个站点的所有请求都是采用的Ajax,所以对FCKeditor进行赋值操作时也必须用JavaScript,之前是直接调用的FCKeditorAPI.GetInstance(“xxx”).SetHTML(“xxx”),但是现在发现FireFox不支持这个函数。
具体原因可能是此函数的实现是调用的innerText进行赋值操作的,而FireFox不支持innerText这个属性,必须用textContent。个人看法,错了的话请轻拍,呵呵。
看来,直接用API是不行了,只能是自己动手丰衣足食了。
检查DOM元素,找到了FCKeditor的编辑域对应的body,对其内容赋值FCKeditorAPI.GetInstance(“xxx”).EditorDocument.body.textContent=”xxx”;
完美解决,呵呵。
notice:
对FCKeditor进行操作之前,一定要等待FCKeditor载入完成,否则操作必定失败,最好的方法是自己实现FCKeditor_OnComplete()函数,在FCKeditor载入完成之后会自动调用这个函数。
如果一个页面有多个FCKeditor,则可以实现FCKeditor_OnComplete(xxx),其中xxx将会是载入完成的FCKeditor元素。
在后台取值并在前端赋值的时候,数据必须进行HTML转码,否则如果取到的数据包含HTML元素的话,整个DOM文档结构会被破坏。
下面附上两个很巧妙的HTML转码和解码函数,非常另类,非常给力,非常有创意,非常好用:
// Html转码
function HtmlEncode(encodeHtml) {
var div = document.createElement(“div”);
var text = document.createTextNode(str);
div.appendChild(encodeHtml);
return div.innerHTML;
}
// Html解码
function HtmlDecode(decodeHtml) {
var temp = document.createElement(“div”);
temp.innerHTML = decodeHtml;
var output = temp.innerText || temp.textContent;
temp = null;
return output;
}