JSColorでは、どのように色の16進数を取得できますか？

Question

JSColorを使用すると、ユーザーが色を選択した後、どのように「16進」を取得できますか？

$("input#colorpicker").css('background-color') => this returns background-color: rgb(107, 132, 255); 

ただし、16進数ではありません。

Answer 1

jQuery.cssが設定された値を返すと仮定します。 HEXにRGBを変換するには、次の機能を試してみてください。

function colorToHex(color) { 
    if (color.substr(0, 1) === '#') { 
     return color; 
    } 
    var digits = /(.*?)rgb\((\d+), (\d+), (\d+)\)/.exec(color); 

    var red = parseInt(digits[2]); 
    var green = parseInt(digits[3]); 
    var blue = parseInt(digits[4]); 

    var rgb = blue | (green << 8) | (red << 16); 
    return digits[1] + '#' + rgb.toString(16); 
}; 

colorToHex('rgb(120, 120, 240)') 

Answer 2

利用できるのonchangeイベントがあります：

$("input#colorpicker").change(function() { 
    console.log(this.color); 
}); 

Answer 3

が、これはそれがチェックアウトとにかく、RGBまたは六角に返し、ブラウザに依存度合い件まで実際にこのスレッドには素晴らしい議論があり、多くの解決策もあります。

Background-color hex to JavaScript variable

と

How to get hex color value rather than RGB value?

と

Can I force jQuery.css("backgroundColor") returns on hexadecimal format?

と

jquery css color value returns RGB?