懸停時的背景顏色不變

Question

我試圖使用數組中的隨機顏色更改元素的背景顏色。有代碼：

$(document).ready(function(){ 

var randomColors = ['#00eeff','#fcff00','#9600ff']; 
var rndNum = Math.floor(Math.random() * randomColors.length); 

$("div.anyclass").hover(
     function() { 
$(this).css({'background-color' : 'randomColors[rndNum]'}) 
}, 
     function() { 
$(this).css({'background-color' : '#fff'}); 
     }); 
}); 

所以，它不工作，問題在哪裏？

Answer 1

你只需要刪除引號，像這樣：

$("div.anyclass").hover(function() { 
    $(this).css({'background-color' : randomColors[rndNum]}) 
}, function() { 
    $(this).css({'background-color' : '#fff'}); 
}); 

目前，它正試圖設置字符串作爲正是'randomColors[rndNum]'，而不是數組中條目的值，例如'#00eeff'。

Answer 2

改變這一行：

$(this).css({'background-color' : 'randomColors[rndNum]'}) 

這樣：

$(this).css({'background-color' : randomColors[rndNum]}) 

變量不會，如果它是一個字符串中擴展。

Answer 3

您需要從'randomColors[rndNum]'刪除引號，否則就變成了純粹的字符串：

$(this).css({'background-color': randomColors[rndNum]}) 

OR

$(this).css({backgroundColor: randomColors[rndNum]})