我可以强制jQuery.css（" backgroundColor"）以十六进制格式返回吗？ [英] Can I force jQuery.css("backgroundColor") returns on hexadecimal format?

问题描述

我有一个像这样的元素：

 < p>我的文字带有< strong class = >样本高亮< / strong>。< p> 
  

和CSS类一样：

  .highlighted {
 background：＃f0ff05; 
 font-weight：normal; 
} 
  

但是，当我使用这样的jQuery时：

  $（。highlighted）。css（backgroundColor）; 
  

它返回 rgb（240,255,5）。我可以写一些函数来从 rgb 转换为 hex ，但是我想知道是否有某种方法可以让jQuery以十六进制格式返回已有值。 。 （除IE6已返回 hex> ），那么我们不能以本机的其他格式返回。

像你所说的，你可以写一个函数来将转换为rgb 。以下是一个有关如何编写此函数的几个示例的主题：如何获取十六进制颜色值而不是RGB值？。

但是你想知道是否有一种方法可以直接以十六进制格式返回jQuery：答案是肯定的，这是可能的使用 CSS Hooks 自jQuery 1.4以来.3。

代码应该是：

  $。cssHooks如果（elem.currentStyle）
 var bg = elem.currentStyle [backgroundColor]; 
 else if（window.getComputedStyle）
 var bg = document.defaultView.getComputedStyle（elem，
 null）.getPropertyValue（background-color）; 
 if（bg.search（rgb）== -1）
 return bg; 
 else {
 bg = bg.match（/ ^ rgb\（（\ d +），\ s *（\ d +），\ s *（\ d +）\） $ /）; 
函数hex（x）{
 return（0+ parseInt（x）.toString（16））。slice（-2）; 
返回＃+ hex（bg [1]）+ hex（bg [2]）+ hex（bg [3]）; 
 
 
 
 $ / code> 

当你调用 $（.double）.css（backgroundColor），返回值将是＃f0ff05 。这是一个工作示例，让您看到它正常工作。

I have an element like this:

<p>My text with a <strong class="highlighted">sample highlight</strong>.<p>

And the CSS class like this:

.highlighted {
    background: #f0ff05;
    font-weight: normal;
}

But when I use a jQuery like this:

$(".highlighted").css("backgroundColor");

It returns rgb(240, 255, 5). I could write some function to convert from rgb to hex, but I would like to know if there is some way to jQuery return the value already on hexadecimal format.

解决方案

Colors are always returned as rgb (except IE6 which already returns in hex), then we cannot return in another format natively.

Like you said, you can write a function to convert hex to rgb. Here is a topic with several examples of how to write this function: How to get hex color value rather than RGB value?.

But you wonder if there is a way to directly return the jQuery already in hex: the answer is yes, this is possible using CSS Hooks since jQuery 1.4.3.

The code should be:

$.cssHooks.backgroundColor = {
    get: function(elem) {
        if (elem.currentStyle)
            var bg = elem.currentStyle["backgroundColor"];
        else if (window.getComputedStyle)
            var bg = document.defaultView.getComputedStyle(elem,
                null).getPropertyValue("background-color");
        if (bg.search("rgb") == -1)
            return bg;
        else {
            bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
            function hex(x) {
                return ("0" + parseInt(x).toString(16)).slice(-2);
            }
            return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
        }
    }
}

And when you call $(".highlighted").css("backgroundColor"), the return will be #f0ff05. Here is a working sample to you see it working.

这篇关于我可以强制jQuery.css（" backgroundColor"）以十六进制格式返回吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！