jQuery 语法：-linear-gradient("color", white) 以 "color" 作为变量答案

【问题标题】：jQuery Syntax: -linear-gradient("color", white) with "color" as variablejQuery 语法：-linear-gradient("color", white) 以 "color" 作为变量
【发布时间】：2015-10-01 12:18:33
【问题描述】：

我有一个<div>，它会根据像这样给出的百分比改变它的颜色

ProgressBar.color = function(value, maxVal) {
    var bcolor;
    var color;
    var percentage = (value / maxVal) * 100;
    //For each percentage, different colors
    if (percentage >= 0 && percentage < 25) {
        bcolor = "green";
        color = "black";
    } else if (percentage >= 25 && percentage < 50) {
        bcolor = "yellow";
        color = "green";
    } else if (percentage >= 50 && percentage < 75) {
        bcolor = "orange";
        color = "blue";
    } else if (percentage >= 75 && percentage <= 100) {
        bcolor = "red";
        color = "black";
    }

    //Setters
    $('#bar').css("background-color", bcolor);
    $('#bar').css("color", color);
};

但现在我想添加一些渐变效果。我的问题是：

当您使用变量作为颜色时，-linear-gradient() 的语法是什么？

我有这个，但它不起作用：

$('#bar').css("background", "-moz-linear-gradient('bcolor', white, 'bcolor')");

【问题讨论】：

标签： javascript jquery css linear-gradients radial-gradients

【解决方案1】：

你只需要如下连接变量：

$('#bar')
    .css("background", "-moz-linear-gradient(" + bcolor + ", white, " + bcolor + ")");
//                                           ^^^^^^^^^^^^^^^        ^^^^^^^^^^^^^^

【讨论】：

【解决方案2】：

一个简单的方法是使用字符串连接："-moz-linear-gradient('" + bcolor + "', white, '" + bcolor + "')"

【讨论】：