2013-03-12 125 views
1

您好我有一個帖子在這裏http://jsfiddle.net/7ztEf/9/這說明了什麼我想要實現。陣列索引N.O. +價值

我會打破它,我需要填寫基於數組索引值一個div BG,這些都是4張隨機數1-40之間,說返回的數字是5,15,25,35。其中的邏輯是,如果數字範圍1-10然後DIV BG是紅色的,如果11-20然後藍等

我一直殺害自己在這個,真的需要一些建議再這樣做的最好的辦法,非常感謝P

function myNumbers(numbers, type) { 
for (var x in numbers) { 
    document.getElementById(type + x).innerHTML = numbers[x]; 

    /* 
    here I need to query each index value and apply to ball div, ie: 

    if index 0 numbers > 0) && numbers <= 10 than ball-0 div bg is red 
    if index 0 numbers > 11) && numbers <= 20 than ball-0 div bg is blue 
    if index 0 numbers > 21) && numbers <= 30 than ball-0 div bg is orange 
    if index 0 numbers > 31) && numbers <= 40 than ball-0 div bg is green 

    repeating for eack index value. 

    if index 1 numbers > 0) && numbers <= 10 than ball-1 div bg is red 

    etc  

    */ 

} 

}

通過myNumbers([5,15,25,35], '試驗 - ')

回答

1

對於剛剛幾個顏色我只想寫出來是這樣的:

for (var x = 0, n = numbers.length; x != n; ++x) { 
    var nr = numbers[x], 
     el = document.getElementById(type + x), 
     color; 

    el.innerHTML = nr; 

    if (nr > 0) { 
     if (nr <= 10) { 
      color = 'red'; 
     } else if (nr <= 20) { 
      color = 'blue'; 
     } else if (nr <= 30) { 
      color = 'orange'; 
     } else if (nr <= 40) { 
      color = 'green'; 
     } 
    } 
    if (color) { 
     el.style.color = color; 
    } 
} 

Demo

+0

感謝@Jack,即設定我的權利! ! – tuvboy 2013-03-12 08:53:19

0

我願意做這樣的事情:

var colors = ['red', 'blue', 'orange', 'green']; 

function myNumbers(numbers, type) { 
    for (var i = 0; i < numbers.length; i++) { 
     var number = numbers[i]; 
     var color = colors[Math.floor(number/colors.length)]; 

     document.getElementById(type + i).innerHTML = number; 
     document.getElementById('ball-' + i).style.backgroundColor = color; 
    } 
} 

不要使用for...in語法遍歷數組。這遍歷了對象的屬性。

1

試試這個..

for (var x = 0;x<numbers.length;x++) { 

    el = document.getElementById(type + x); 

el.innerHTML = nr; 

if (nr > 0) { 
    if (nr <= 10) { 
     color = 'red'; 
    } else if (nr <= 20) { 
     color = 'blue'; 
    } else if (nr <= 30) { 
     color = 'orange'; 
    } else if (nr <= 40) { 
     color = 'green'; 
    } 
} 
if (color) { 
    document.getElementById('ball-' + x).style.backgroundColor = color; 
} 
}