将var作为参数传递

Question

在我正在制作的网站上，我需要一个进度条，我找到了适合我需求的一个。默认情况下，当达到一定比例（0-30红，30-70橙等）时，它将逐渐改变颜色。我唯一的问题是改变他们，我可以很容易地用一个像50这样的静态数字来设置它们，但是当我尝试动态地执行它（即：2000 * .3 = 600）时，它会失败。我不太了解js/jquery，所以这对我来说尤其困难，如果你能帮上忙，那会很棒。我很确定这是一件很简单的事，我错过了。

失败代码：

var barmax = 2000; 
var orangeBound = Math.round(barmax * .3); 
var greenBound = Math.round(barmax * .7); 
//alert(orangeBound+":"+greenBound); 
$("#pb1").progressBar({ max: barmax, textFormat: 'fraction', 
barImage: { 
     0: 'images/progressbg_red.gif', 
     orangeBound: 'images/progressbg_orange.gif', 
     greenBound: 'images/progressbg_green.gif'} 
    }); 

的作品，但我不能使用，因为它是动态的代码：

$("#pb1").progressBar({ max: barmax, textFormat: 'fraction', 
    barImage: { 
     0: 'images/progressbg_red.gif', 
     600: 'images/progressbg_orange.gif', 
     1400: 'images/progressbg_green.gif'} 
    }); 

如果您需要查看源，here。再次感谢！

Answer 1

的问题是，使用orangeBound作为对象字面的关键是指字符串"orangeBound"使用，而不是变量的值。相反，请尝试构建像这样的对象：

var barImage = {0: 'images/progressbg_red.gif'}; 
barImage[orangeBound] = 'images/progressbg_orange.gif'; 
barImage[greenBound] = 'images/progressbg_green.gif' 
var barmax = 2000; 
var orangeBound = Math.round(barmax * .3); 
var greenBound = Math.round(barmax * .7); 
$("#pb1").progressBar({ 
    max: barmax, 
    textFormat: 'fraction', 
    barImage: barImage 
}); 

Answer 2

在JS中，{orangeBound：“foo”}只会产生一个名为“orangeBound”的包含值“foo”的键。你必须单独建立对象：

var barImages = {0: 'images/progressbg_red.gif'}; 
barImages[orangeBound] = 'images/progressbg_orange.gif'; 
// ... 
$(...).progressBar({..., barImage: barImages});