0

重複の可能性：
jQueryを使用してRGB値ではなく16進値を取得する

私は<span>このようなものを持っています：

<span class="colour" style="background:#000000;"></span>

IE 8を含むほとんどのブラウザーでは、次のように背景色の16進値を取得できます。

$('span.colour').attr('style').match(/#[0123456789ABCDEF]{3,6}/gi);

ただし、IE 9では$('span.colour').attr('style')、次の文字列が返されます。

background: rgb(0, 0, 0);

JavaScriptで16進数に変換し直す必要がありますか、それともIE 9で要素から直接16進数値（つまり、実際にはHTMLにあるもの）を取得する方法はありますか？

4

2 に答える 2

2

以下を使用して変換できます（ソース）。

最近のほとんどのブラウザ（chromeを含む）は、16進数ではなくRGBを返すと思います。

おそらく、基本的な一致を実行して、それが16進数かRGBかを判断し、必要に応じてRGBを変換することができます。

function rgb2hex(rgb) {
    rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
    function hex(x) {
        return ("0" + parseInt(x).toString(16)).slice(-2);
    }
    return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}

Cody O'Dellによって検出された更新バージョン（アルファをサポート）：

//Function to convert hex format to a rgb color
function rgb2hex(rgb){
 rgb = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
 return (rgb && rgb.length === 4) ? "#" +
  ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : '';
}
于 2012-12-18T16:43:05.060 に答える
1

あなたのためにそれを行うための直接的な機能がIEにあるとは思いません。RGB 値を 16 進コードに変換するには、JS を使用するしかありません。

これは、色の値を16進数に変換できる関数です

function toHex(color) {
  var body  = createPopup().document.body,
      range = body.createTextRange();
  body.style.color = color;
  var value = range.queryCommandValue("ForeColor");
  value = ((value & 0x0000ff) << 16) | (value & 0x00ff00) | ((value & 0xff0000) >>> 16);
  value = value.toString(16);
  return "#000000".slice(0, 7 - value.length) + value;
};

ここで詳細を読むことができます： http://dean.edwards.name/weblog/2009/10/convert-any-colour-value-to-hex-in-msie/

于 2012-12-18T16:46:04.007 に答える