javascript - jQuery - HSL 彩色背景

Question

我在使用 Javascript/jQuery 时遇到了一个奇怪的问题。我需要使用下面编写的函数使用 HSL 颜色模型更新背景颜色:

function updateColorPreviewHSV(hsv){
    var hue = Math.round(hsv.getHue(), 0);
    var saturation = Math.round(hsv.getSaturation()*100, 0);
    var value = Math.round(hsv.getValue()*100, 0);

    var hsvText = "hsl("+hue+","+saturation+"%,"+value+"%)";
    console.log(hsvText);
    $("#pickedColor").css({"background": hsvText });
}

给定的输出很好，但它不会改变背景颜色。 hsvText 变量的输出示例:

hsl(336,74%,100%)
hsl(340,73%,100%)
hsl(343,73%,100%)
hsl(307,73%,100%)

仅当我手动将值键入变量时才会发生更改，如下所示:

function updateColorPreviewHSV(hsv){

    var hue = 100;
    var saturation = 70;
    var value = 40;

    var hsvText = "hsl("+hue+","+saturation+"%,"+value+"%)";
    console.log(hsvText);
    $("#pickedColor").css({"background": hsvText });
}

并且它有效。那么 - 为什么第一个功能不想正常工作？我哪里出错了？

Answer 1

你的脚本运行良好。就是这样

hsl(336,74%,100%)
hsl(340,73%,100%)
hsl(343,73%,100%)
hsl(307,73%,100%)

都是白色阴影，因此您看不出差异。

http://hslpicker.com/