JavaScript開關，用於使用css（）更改背景顏色

Question

我有一個非常簡單的功能，該功能應該根據所單擊的特定鏈接來更改頁面背景顏色，但是我不知道為什么它不起作用。

這是到目前為止的演示： http : //jsfiddle.net/cF74Y/

看來這肯定是一個微不足道的錯誤，但我看不到它。 任何幫助將不勝感激。

Answer 1

您將字符串與數字進行比較，將switch (currentItem)更改為switch (+currentItem)將使您的演示工作正常。

另外：您可以將currentItem作為參數傳遞，而不是使用全局變量。

這是工作演示。

Answer 2

我認為您使事情變得過於復雜，難道您不可以這樣做嗎？

的HTML：

<ul id="nav">
    <li><a class="color" href="#">red</a></li>
    <li><a class="color" href="#">green</a></li>
    <li><a class="color" href="#">blue</a></li>
    <li><a class="color" href="#">yellow</a></li>
</ul>

jQuery的：

$('a.color').click(function(){
    $('body').css('background-color', $(this).text());
});

演示： http ： //jsfiddle.net/elclanrs/8yev9/

編輯：並且，如果您需要使用數組通過索引分配顏色，我認為您不需要那丑陋的switch語句，對我來說似乎毫無用處，所有這些代碼都可以簡化為：

var colors = ['red', 'blue', 'green', 'yellow'];
$('a.color').click(function(){
    $('body').css('background-color', colors[$(this).parent().index()]);
});

演示： http ： //jsfiddle.net/elclanrs/8yev9/1

Answer 3

嘗試這個：

var index = parseInt($(this).attr('id'),10);

那么它將起作用。

原因：.attr（）函數的返回類型為字符串，並且始終為true情況1。 只需使用parseInt函數。

Answer 4

也許您必須在函數調用中給參數“ currentItem”。

changeBg(currentItem); // call

您的函數將如下所示：

function changeBg(currentItem) {
    var bg = 'null';
    switch (currentItem) {
        case 1 :
            bg = '#6A6A6A';
[..]

Answer 5

這是工作副本

http://jsfiddle.net/cF74Y/34/

Answer 6

使用parseInt與大小寫進行比較，因此無法進行比較。 http://jsfiddle.net/cF74Y/43/