Firefox和IE的轉換原來的顏色值，RGB

UPDATE：問題是FF的.cloneNode（）方法：http://jsfiddle.net/beCVL/1/Firefox和IE的轉換原來的顏色值，RGB

我知道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/

來源

2012-04-03 NullVoxPopuli

「顏色值與服務器上的內容不匹配」是什麼意思？字符串明智？因爲'rgb（255，0，0）'正好是'＃ff0000'。 – Bojangles 2012-04-03 00:16:46

這是不準確的。一個是十六進制，另一個是RGB。我認爲我很直率，但是.. idk。 = \ – NullVoxPopuli 2012-04-03 00:17:34

您是指每種符號產生的顏色，還是實際的符號本身？ – Bojangles 2012-04-03 00:18:18

如果要比較兩個顏色值的每一個可以以幾種不同的方式表示，那麼你必須確保兩者都轉換爲規範形式（例如完全相同的形式）。

所以，你可以使用rgb(x,y,z)作爲規範的形式，如果你想要的，但你必須確保任何顏色值表示爲#xyz或#xxyyzz是在比較之前先轉換爲RGB格式。

這裏有顏色的三個值全部轉換爲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); 
}

來源

2012-04-03 00:31:33 jfriend00

正如我在http://cksource.com/forums/viewtopic.php?f=11&t=25141回答你，你可以使用原來的「輸出HTML「示例，其中包含已鏈接並使用convertRGBToHex函數的博客中複製的完整代碼。

而BTW，Firefox尊重風格，目前唯一改變該部分的瀏覽器是IE。

來源

2012-04-03 13:10:48 AlfonsoML

但是，爲什麼FF中的CKeditor返回的內容與Chrome中的CKeditor不同？ – NullVoxPopuli 2012-04-03 14:19:47

對我而言，他們返回相同的東西。我不知道你是如何執行你的測試。我的測試是：去http://ckeditor.com/demo，清除內容並輸入hello。選擇全部並應用顏色，切換到源。我得到這個：

你好

– AlfonsoML 2012-04-03 15:40:13

這就是我如何得到的文本：\t \t var yourEditor = CKEDITOR.instances.selected_text_actual; \t \t var formattedDataForWysiWyg = yourEditor.dataProcessor.toHtml（yourEditor.getData（））; \t \t var temp_sel = yourEditor.dataProcessor.toDataFormat（formattedDataForWysiWyg）; – NullVoxPopuli 2012-04-03 16:28:19

克隆節點改變樣式屬性的事實幾乎可以肯定是Gecko中的bug，但同時element.style.color在兩種情況下都會返回rgb(255, 0, 0)。

來源

2012-04-03 20:02:57 Neil

Firefox和IE的轉換原來的顏色值，RGB

回答

相關問題