Question

可能重复：
Get hex value rather than RGB value using jQuery

我有<span>这样：

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

在大多数浏览器中，包括IE 8，我可以得到背景颜色的十六进制值，如下所示：

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

但是，在IE 9中，$('span.colour').attr('style')返回以下字符串：

background: rgb(0, 0, 0);

我是否必须在JavaScript中转换回十六进制，或者有没有办法让IE 9直接从元素中给出十六进制值（即实际上在该死的HTML中的东西）？

Answer 1

您可以使用以下内容进行转换（source）。

我相信大多数现代浏览器（包括chrome）都会返回rgb而不是hex。

也许你可以做一个基本匹配来判断它是十六进制还是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]);
}

更新版本（支持alpha），由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) : '';
}

Answer 2

我不认为IE中有直接的功能可以帮到你。使用JS是将rgb值转换为十六进制代码的唯一方法。

这是一个可以将颜色值转换为十六进制

的函数

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/

如何在IE 9中使用JavaScript将样式属性中的背景颜色作为十六进制值？

2 个答案: