Передача 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});