Question

使用JSColor，在用户选择颜色后，如何获得“hex”？

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

但不是十六进制。

Answer 1

我假设jQuery.css返回已设置的值。尝试使用以下函数将RGB转换为HEX：

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

实际上这取决于它以rgb或hex返回的浏览器，无论如何看看这个帖子有很好的讨论，并且还有很多解决方案。

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?

Answer 3

有onchange事件：

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

在JSColor中，我如何获得颜色的十六进制？

3 个答案: