jquery css color değeri RGB'yi döndürüyor? Benim CSS dosyasında

Question

:

Birlikte çalıştığımız

a, a:link, a:visited { color:#4188FB; } 
a:active, a:focus, a:hover { color:#FFCC00; } 

:

var link_col = $("a:link").css("color"); 
alert(link_col); // returns rgb(65, 136, 251) 

nasıl HEX kodunu alabilirim?

*** edit:
Background-color hex to JavaScript variable

utanç bana, göndermeden önce biraz daha iyi arama olabilir ..

gittiğiniz İşte

Answer 1

, bu kullanmanızı sağlayacak: Burada cevabını buldu $ (seçici) .getHexBackgroundColor() kolayca heks değeri veren:

$.fn.getHexBackgroundColor = function() { 
    var rgb = $(this).css('background-color'); 
    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]); 
} 

Answer 2

Bazı ayarliyor

işlev

$.fn.getHexBackgroundColor = function() { 
    var rgb = $(this).css('background-color'); 
    if (!rgb) { 
     return '#FFFFFF'; //default color 
    } 
    var hex_rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); 
    function hex(x) {return ("0" + parseInt(x).toString(16)).slice(-2);} 
    if (hex_rgb) { 
     return "#" + hex(hex_rgb[1]) + hex(hex_rgb[2]) + hex(hex_rgb[3]); 
    } else { 
     return rgb; //ie8 returns background-color in hex format then it will make     compatible, you can improve it checking if format is in hexadecimal 
    } 
} 

Answer 3

İşte benim almam. Basit ve özlü.

(function($) { 
 
    $.fn.getHexBackgroundColor = function() { 
 
    return (function(rgb) { 
 
     return '#' + (!rgb 
 
     ? 'FFFFFF' 
 
     : rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/) 
 
      .slice(1) 
 
      .map(x => ('0' + parseInt(x).toString(16)).slice(-2)) 
 
      .join('') 
 
      .toUpperCase()); 
 
    })($(this).css('background-color')); 
 
    } 
 
})(jQuery); 
 

 
$(function() { 
 
    $('#color-rgb').text($('.foo').css('background-color')); 
 
    $('#color-hex').text($('.foo').getHexBackgroundColor()); 
 
});

.foo { 
 
    background: #F74; 
 
    width: 100px; 
 
    height: 100px; 
 
} 
 

 
label { font-weight: bold; } 
 
label:after { content: ': '; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="foo"></div> 
 
<label>RGB</label><span id="color-rgb">UNDEF</span><br /> 
 
<label>HEX</label><span id="color-hex">UNDEF</span>