javascript - jQuery从div的CSS值切换

此jQuery适用于3个div-leftKey，rightKey和mentors。它们都正确对齐。
目的是当单击leftKey时，导师将循环浏览背景色列表。我在数组中定义了颜色；红色然后蓝色然后绿色。我已经获得了按键来响应单击，但是该开关不起作用。

$(document).ready(function() {
          var colors = [ "rgb(128, 0, 0)", "rgb(255, 0, 0)", "rgb(0, 0, 255)", "rgb(0, 128, 0)"];
          //burgundy, red, blue, green
          var mentors = $("#mentors");
          $("#leftKey").click(function() {
            if(mentors.css("background-color") == colors[0]) {
              mentors.css("background-color", colors[colors.length-1]);
            } else {
              for(var x = 0; x < colors.length; x++) {
                if( mentors.css("background-color") == colors[x]) {
                  mentors.css("background-color", colors[x-1]);
                }
              }
            };
          });
          $("#rightKey").click(function() {
            if( mentors.css("background-color") == colors[colors.length-1]){
              mentors.css("background-color", colors[0]);
            } else {
              for(var x = 0; x < colors.length; x++) {
                if( mentors.css("background-color") == colors[x] ) {
                  mentors.css("background-color", colors[x+1]);
                  return false;
                }
              }
            };
          });

最佳答案

为了相当简化您的生活，需要进行一些重构。尝试这个：

var colors = [ "red", "blue","green"],
    getColor = function (leftRight, currentColor) {
        var newColorIndex
            isLeft = leftRight === "left";
        if (currentColor === colors[0]) {
            newColorIndex = (isLeft) ? 2 : 1;
        } else if (currentColor === colors[1]) {
            newColorIndex = (isLeft) ? 0 : 2;
        } else {
            newColorIndex = (isLeft) ? 1 : 0;
        }
        return colors[newColorIndex];
    },
    colorSwitch = function (leftRight) {
        var mentors = $("#mentors"),
            currentColor = mentors.css("background-color"),
            newColor = getColor(leftRight, currentColor);
        $("#mentors").css("background-color", newColor);
    };
$(document).ready(function() {
    $("#leftKey").click(function() {
        colorSwitch("left");
    });
    $("#rightKey").click(function() {
        colorSwitch("right");
    });
});