FireFox和IE将原始颜色值转换为RGB

Question

更新：问题出在FF的.cloneNode（）方法上： http : //jsfiddle.net/beCVL/1/

我知道FF和IE在内部将颜色转换为RGB，这会引起问题，因为颜色值与服务器上的值不匹配。

证明：

Chrome 18:
CKEDITOR.instances.selected_text_actual.getData()
>> "s <span style="color: #ff0000">text</span>"

FireFox 11:
CKEDITOR.instances.selected_text_actual.getData()
>> "s <span style="color: rgb(255, 0, 0);">text</span>"

因此，我要解决此问题的方法是使CKEditor的数据处理器始终使用rgb值。 有没有办法做到这一点？

我发现这样的事情应该起作用：

CKEDITOR.on( 'instanceReady', function( ev ){
            var editor = ev.editor,
                dataProcessor = editor.dataProcessor,
                htmlFilter = dataProcessor && dataProcessor.htmlFilter;

            // HTML 4 way to end tags
            dataProcessor.writer.selfClosingEnd = '>';

            htmlFilter.addRules({
                elements:{
                    $:function(element){
                        var e = jQuery(element);
                        e.css("color", e.css("color")); // jquery auto converts to rgb
                    }
                }
            });

        });

来源： http ： //sebduggan.com/blog/customising-ckeditor-settings-in-mura/ ，但是没有变化。

转换为RGB非常简单：

a.attr("style", "color: #444")
[
<div style=​"color:​ #444">​</div>​
]
a.css("color", a.css("color"));
[
<div style=​"color:​ rgb(68, 68, 68)​;​ ">​</div>​
]

编辑：问题出在FF的.cloneNode（）方法上： http : //jsfiddle.net/beCVL/1/

Answer 1

正如我在http://cksource.com/forums/viewtopic.php?f=11&t=25141中答复的那样，您可以使用原始的“输出HTML”示例，该示例包含已复制到链接的博客中的完整代码。并使用convertRGBToHex函数。

顺便说一句，Firefox尊重样式，当前更改该部分的唯一浏览器是IE。

Answer 2

克隆节点会更改样式属性这一事实几乎可以肯定是Gecko中的一个错误 ，但与此同时， element.style.color在这两种情况下都将返回rgb(255, 0, 0) 。

Answer 3

如果要比较可以用几种不同方式表示的两个颜色值，则必须确保将两个颜色值都转换为规范形式（例如，完全相同的形式）。

因此，您可以根据需要使用rgb(x,y,z)作为规范形式，但是在比较之前，必须确保首先将表示为#xyz或#xxyyzz任何颜色值转换为rgb形式。

这是一个将三个颜色值全部转换为rgb(x,y,z)且不带空格的rgb(x,y,z)然后将它们进行比较并返回结果：

function colorsAreSame(c1, c2) {
    var space = /\s+/g;

    function makeRGB(c) {
        var r, g, b;
        c = c.replace(space, "");
        if (c.charAt(0) == "#") {
            if (c.length == 4) {
                r = parseInt(c.charAt(1), 16);
                r = (r * 16) + r;
                g = parseInt(c.charAt(2), 16);
                g = (g * 16) + g;
                b = parseInt(c.charAt(3), 16);
                b = (b * 16) + b;
            } else if (c.length == 7) {
                r = parseInt(c.substr(1, 2), 16);
                g = parseInt(c.substr(3, 2), 16);
                b = parseInt(c.substr(5, 2), 16);
            }
            return "rgb(" + r + "," + g + "," + b + ")";
        } else {
            return(c);
        }
    }
    c1 = makeRGB(c1);
    c2 = makeRGB(c2);
    return(c1 == c2);
}